Дизайн и креатив: разработка от профессионалов http://uptimecommerce.com/forum/ |
|
Проблемы с HTML версткой http://uptimecommerce.com/forum/viewtopic.php?f=22&t=554 |
Страница 1 из 2 |
Автор: | voronmail [ 14 авг 2009, 08:09 ] |
Заголовок сообщения: | Проблемы с HTML версткой |
Я верстаю сайт в dreamweaver, XHTML Transitional, с помощью разметочных слоев (абсолютное расположение, постоянная (не "резиновая") ширина страницы, а слои размещаю в родительском теге carrier. В книге я прочитала, что абсолютное расположение идет от родительского элемента, но почему границы так скачут? В браузере firefox - одни расстояния слоев друг от друга, в интернет эксплорере - другое, на мониторе меньшей диагонали - третье! Как с этим справиться, есть ли такой рецепт сайта с абсолютно постоянной шириной независимо от разных ситуаций? Причем я стараюсь использовать блочную верстку, это правило номер 1. Может кто то сможет поделиться опытом? |
Автор: | dimsem [ 14 авг 2009, 08:35 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
Я лично люблю полуабсолютное позиционирование: контентный слой выношу margin'ом, а блоки размещаю в одном месте кода, и приравниваю к бокам уже абсолютно. Так я получаю очень удобную структуру - ссылочная база вначале, и чистый неразрывный контент в конце... ну или наоборот. Касаемо конкретики, давайте-ка сюда подопытное тело. |
Автор: | Иван Скворцов [ 14 авг 2009, 09:05 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
какие умные слова ппц! Проще пишите! А то столько слов чтоб написать : как отцентровать чтоб показывало везде одинаково, или почему осел показывает криво!))) Будте проще к вам потянутся!) |
Автор: | dimsem [ 14 авг 2009, 09:12 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
сайт и css сюда, либо мне в пм. |
Автор: | sawsana [ 14 авг 2009, 14:44 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
вот и я мучилась этим..спасали padding и margin. может, проще скачать готовый шаблон и дорабатывать дизайн? |
Автор: | voronmail [ 14 авг 2009, 14:49 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
Максим, Вообщем в три колонки получается: <title>Земпроект - Добро пожаловать!</title> <link href="style1.css" rel="stylesheet" type="text/css" /> <style type="text/css"> <!-- #html, body { margin: 0px; padding: 0px; height: auto; width: auto; border: 0px; } #body { background-color: #CCCCCC; font-family: Georgia, "Times New Roman", Times, serif; font-size: 12px; color: #666666; margin-left:3px; margin-right:3px; } #carrier { width: 930px; height:1150px; background-color: #FFFFFF; clear:both; padding:0px; margin-top:0px; margin-left:auto; margin-right:auto; z-index:1; } #header { clear:both; margin: 0px; padding: 0px; position: relative; width:930px; z-index:1; left: 0px; top: 0px; } #menu { position:relative; left: 0px; top: 0px; float:left; margin:0px; padding:0px; } #news { padding:5px; background-image: url(image/kart.jpg); background-repeat:no-repeat; font-size:9px; float:left; height: 450px; } #Layer1 { position: absolute; width:408px; height:115px; z-index:2; left: 313px; top: 197px; } #Layer2 { position:absolute; width:199px; height:115px; z-index:3; left: 747px; top: 197px; } #bottom { position:absolute; width:907px; height:48px; z-index:1; left: 49px; top: 993px; clear:both; background-image: url(image/bottom.gif); background-repeat: repeat-x; } --> </style> </head> <body> <div id="carrier"> /*шапка*/ <div id="header"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/fl...,0,19,0" width="930" height="190" title="header"> <param name="movie" value="header.swf" /> <param name="quality" value="high" /> <embed src="header.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="930" height="190"></embed> </object> </div> /*флеш менюшка справа*/ <div id="menu"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/fl...,0,19,0" width="270" height="190"> <param name="movie" value="menu1.swf" /> <param name="quality" value="high" /> <embed src="menu1.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="270" height="190"></embed> </object> /*под нею ссылки на статьи*/ <div id="news"> <p class="n">...</p> </div> </div> /*Основной текст*/ <div id="Layer1"> <h5 align="justify">...</h5> <p>... </p> </div> /* а это слева идет столбец */ <div id="Layer2"> <p>...... </p> <div id="novosty"> <h5 align="center" class="style3"> Наши новости</h5> <p> ...</p> </div></div> /*внизу подвал*/ <div id="bottom"><p>...</p> </div> </div> </body> </html> |
Автор: | dimsem [ 14 авг 2009, 17:03 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
Задача: сделать сайт полностью жесткий, абсолютным позиционированием, я правильно понял? Быстро написал структуру 3х столбцов, все кроссбраузерно, в чем проблема? BODY{margin:0px;padding:0xp;} DIV{position:absolute;} #wrapper{left:0px;top:0px;width:930px;height:1150px;} #header{left:0px;top:0px;width:930px;height:200px;background-color:#00FFCC;} #menu{left:0px;top:200px;width:200px;height:900px;background-color:#FFFFCC;} #content{left:200px;top:200px;width:530px;height:900px;background-color:#00FFFF;} #news{left:730px;top:200px;width:200px;height:900px;background-color:#FFFFCC;} #footer{left:0px;top:1100px;width:930px;height:50px;background-color:#00CCFF;} </style> <body> <div id="wrapper"> <div id="header"></div> <div id="menu"></div> <div id="content"></div> <div id="news"></div> <div id="footer"></div> </div> </body> Об абсолютном позиционировании: http://on-line-teaching.com/html/lsn029.html#4 Для абсолютного позиционирования элементов Вэб-страницы служит свойство position со значением absolute. При этом браузер "вырывает" элементы абсолютного позиционирования из общего контекста страницы, причем соседние элементы сдвигаются, занимая "освободившееся" пространство. 2Ольга Геннадьевна Некрасова Проблема не в том, качать или не качать шаблоны. Проблема в том, что дизайнеры - люди достаточно далекие от верстки, а поэтому я еще ни разу не видел в сети шаблона, который можно было бы использовать как базис верстки для изысков моего знакомого арт-извращенца. |
Автор: | Apriori [ 15 авг 2009, 16:19 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
Спасибо, Максим, но, как я поняла, при предложенной Вами разметке сайта, весь сайт визуально будет прибит к левому краю монитора, а нельзя ли по середине, так не получится? В вашем учебнике написано, что при абсолютном позиционировании "для указания направления отсчета координат элемента относительно сторон "родительского" объекта (обычно Вэб-страницы) служат свойства top, bottom, left, right." а для моих блоков разве не считается родительским элементом блок, в котором они находятся? у вас он называется #wrapper. |
Автор: | Иван Скворцов [ 15 авг 2009, 16:30 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
Вам надо по середине расположить сайт чтоб в любом браузере смотрелось одинаково?? |
Автор: | Apriori [ 15 авг 2009, 16:39 ] |
Заголовок сообщения: | Re: Проблемы с HTML версткой |
Да! и на любом по размеру мониторе!!!! но без табличной верстки! |
Страница 1 из 2 | Часовой пояс: UTC |
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group http://www.phpbb.com/ |