Jump to content

aJaX

Newbie
  • Posts

    9
  • Joined

  • Last visited

aJaX's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Тоже хотел бы потренироваться
  2. Вот начал верстать, решил пока верх не трогать и заняться отображением новостей, но возникли проблемы 1)не могу сделать так что бы второй столбец с новостями был правее( почему то вниз лезет ) 2)высота левого столбца равна отступу от нужного полодения правого html: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Название сайта</title> <meta http-equiv="content-type" content="text/html; charset=windows-1251"> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div id="wrapper"> <div id="header"> <div class="header_left"></div> </div> <div id="content"> <div class="left_colum"> <div class="title"></div> </div> <div class="right_colum"> <div class="menu"> <ul> <li><a href="#">Home</a></li> <li><a href="#">Service</a></li> <li><a href="#">Support</a></li> <li><a href="#">Careers</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> </div> <div class="news"> <div class="left"> <div class="firts_news"> <span><b>Veroeros</b> sed dolor</span> <hr> <p><img src="images/pic1.png" alt="" /><strong>Fusce nec eros augue</strong> hendrerit erat. Nam dapibus lorem ipsum <a href="#">dolor et suscipit</a> semper. Lorem amet sed conseuat </p> </div> <p>Fusce nec eros augue hendrerit erat. Nam dapibus lorem ipsum <a href="#">dolor et suscipit</a> semper. Lorem amet sed conseuat.Fusce nec eros augue hendrerit erat. Nam dapibus lorem ipsum <a href="#">dolor et suscipit</a> semper. Lorem amet sed conseuat</p> <div class="right"> </div> </div> </div> </div> <div id="footer"></div> </div> </body> </html> css: /* !!! Сброс стилей !!! */ html{color:#000;background:#FFF;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input ,textarea,p,blockquote,th,td{margin:0;padding:0;} table{border-collapse:collapse;border-spacing:0;} fieldset,img{border:0;} li{list-style:none;} caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;} q:before,q:after{content:'';} abbr,acronym {border:0;font-variant:normal;} sup {vertical-align:text-top;} sub {vertical-align:text-bottom;} input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;} legend{color:#000;} ol li{list-style:decimal} /* !!! Сброс стилей Конец !!! */ html, body { background:#d4e3ee url(images/bg.png) repeat-x; color:#4f7276; font-family:Verdana,Tahoma,Arial; font-size:11px; width:100%; min-width:900px; } a { color:#cc0000; } a:hover { text-decoration:none; } p { margin-top:30px; } hr { height:1px; background:#CCCCCC; border:0px; } img { padding:3px; border:1px solid #c6e1e8; margin-right:26px; margin-bottom:26px; float:left; } div#wrapper { margin:0 auto; /* централизуем основной блок */ width:1000px; /* ширина основного блока */ height:auto; } /* Стили header (верхней части сайта) */ div#header { background:url(images/right_head.png) no-repeat top right; width:100%; height:200px; } div.header_left { background:url(images/left_head.png) no-repeat top; width:300px; height:410px; } /* Стили content (средней части сайта) */ div.left_colum { width:300px; height:auto; background:#dee8f9; margin-top:210px; } div.title { background:#3399cc url(images/title_bg.png) repeat-x; height:46px; text-align:center; color:#FFFFFF; font-size:14px; font-weight:bold; } div.right_colum { width:700px; height:auto; background:#FFFFFF; float:right; margin-top:-230px; overflow:hidden; } /* Стили news */ div.news { padding:30px; } div.first_news { text-align:right; } .first_news img { float:left; } div.left { border-right:1px solid #CCCCCC; margin-top:20px; padding-right:30px; width:290px; float:left; } .left b { font-weight:100; font-size:26px; color:#a01111; } .left span { font-size:26px; width:100%; height:26px; color:#205098; } div.right { width:290px; float:right; margin-top:20px; padding-left:30px; } /* Стили menu */ div.menu { background:#3399cc url(images/menu_bg.png) repeat-x; height:76px; width:700px; } div.menu li { float:left; margin-left:40px; margin-top:30px; list-style-image:url(image/menu_r.png); } div.menu a { font-size:14px; color:#FFFFFF; } /* Стили footer (нижней части сайта) */ div#footer { width:100%; height:300px; }
  3. проблема опять же в закруглениях на форму %)
  4. Нужно сделать форму, как на картинке Уже замаялся подскажите как сделать
  5. Я хотел узнать, кто каким способом пользуется
  6. Расскажите как верстать макеты, где есть закругления у блоков. Я пробывал делать таблицу 3x3 и в каждый угол вставлял край заугргленный %) не очень приятная работа. Может есть что то по проще, подскажите =)
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy