Верстка на Div без Table

sl_play · 28.04.2006, 14:41

я соглашусь только с одним, обычные статические странички или же дизайнерские решения - можно сделать и на слоях. Но если есть порталы, множественные выводы из базы - без таблиц вы всё-равно не обойдётесь.

nickspring · 30.04.2006, 12:35

Цитата:

sl_play:
я соглашусь только с одним, обычные статические странички или же дизайнерские решения - можно сделать и на слоях. Но если есть порталы, множественные выводы из базы - без таблиц вы всё-равно не обойдётесь.

Без таблиц можно всегда обойтись. Хотя наверное Вы в чем-то правы... на большом портале наверняка найдутся тексты в которых будут встречаться таблицы данных... Причем тут множетсвенные выводы из базы не совсем понял, ну да ладно... Сам макет страницы всегда можно сверстать и без таблиц...

sl_play · 30.04.2006, 16:58

никогда ты не сверстаешь нормальный диамический портал без таблиц!!!!!
ты можешь сверстать сайт-визитку, какое-нибудь красивое дизайнерское решение не отличающееся большой сложностью и насыщенностью штмл.
Напишите попробуйте кто-то форум без таблиц, или галерею! А я погляжу!

подобная тенденция появилась в связи с тем, что верстать люди стали совершенно не прибегаю к дивам, разработчики этих самых дивов и выпустили в мир подобные слухи-статьи!

Uratsakidogi · 30.04.2006, 17:07

Цитата:

Напишите попробуйте кто-то форум без таблиц

PunBB. Бóльшая часть без таблиц.

nickspring · 30.04.2006, 17:25

Цитата:

sl_play:
никогда ты не сверстаешь нормальный диамический портал без таблиц!!!!!
ты можешь сверстать сайт-визитку, какое-нибудь красивое дизайнерское решение не отличающееся большой сложностью и насыщенностью штмл.
Напишите попробуйте кто-то форум без таблиц, или галерею! А я погляжу!

подобная тенденция появилась в связи с тем, что верстать люди стали совершенно не прибегаю к дивам, разработчики этих самых дивов и выпустили в мир подобные слухи-статьи!

Повторяю еще раз, - написать можно все без таблиц... другое дело что кому-то лень изучать особенности div-верстки и то, что это сложнее чем таблицы. По Вашему разработчики div'ов идиоты? Они же и придумали таблицы, кстати. Придумано это не запросто так, а для того чтобы разметка имела логическую структуру, а не физическую. Есть вещи, кстати, которые не просто реализовать в таблицах, зато запросто в div'ах. Позиция противников div проистекает от банальной лени что-либо изучать новое.

Таблицы предназначены только для таблиц контенте сайта. ИМХО, то что это было и есть популярно, не значит, что это не изврат. DIV - для того и предназначены, чтобы делить страницу на логические блоки, оформление, расположение которых можно произвольно менять при помощи CSS. В идеале, можно прекрасно менять дизайн сайта, изменяя только таблицу стилей CSS.

jsse · 30.04.2006, 17:51

Цитата:

kost:
Высоту 70% от чего считать? И зачем?

Пытался построить такой макет на DIV-ах, ломая голову уже больше 2х дней. Так и не получается... Вся загвоздка в нижней части . Уже начинаю сомневаться, что такой слой вообще можно сделать.

nickspring · 30.04.2006, 17:57

Сейчас попробую сверстать. А sl_play сделал бы на таблицах? Сравнили бы потом...

nickspring добавил [date]1146406412[/date]:
jsse , ну вот, ничего сложного:

пример DIV-верстки

на таблицах без вложенности наверняка не обошлось бы.

nickspring добавил [date]1146406535[/date]:
хех... надо же, еще и валидируется нормально + отображается корректно в Opera, Firefox, IE

jsse · 30.04.2006, 18:38

Открыл. Спасибо большое!

Думаю, что на таблицах такой результат невозможно получить.

--

P.S. Верстаем на DIV

nickspring · 30.04.2006, 18:42

вот скопировал прям из строки браузера :
http://www.controlstyle.ru/trash/jsse/

все вроде нормально

вот еще прямые ссылки на файлы:

http://www.controlstyle.ru/trash/jsse/index.htm
http://www.controlstyle.ru/trash/jsse/index.css

nickspring добавил [date]1146408412[/date]:
CSS:

html, body {width:100%; height:100%; margin:0; padding:0}

#global {width:100%; height:100%; text-align:justify}

#left, #right {color:white; float:left}
#left {background:blue; width:80%; height:70%}
#right {background:red; width:20%; height:300px}

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
<title>Example</title>
<link rel="stylesheet" type="text/css" href="index.css" />
<style type="text/css">

</style>
</head>
<body>
<div id="global">
<div id="left">bla bla bla</div>
<div id="right">bla bla bla</div>
text text text text text text text text text text text text text text
</div>
</body>
</html>

бесконечную строку "text text text ... " - урезал, чтобы пост был короче

sl_play · 30.04.2006, 18:58

а ты однако юморист

PHP код:


			
<body  bottommargin="0" topmargin="0" leftmargin="0" rightmargin="0">

<table width="100%" height="100%" border="1" cellspacing="0" cellpadding="0">

  <tr> 

    <td rowspan="2" width="70%" bgcolor="#0033FF"></td>

    <td height="30%" bgcolor="#FF0000"></td>

  </tr>

  <tr> 

    <td></td>

  </tr>

  <tr> 

    <td colspan="2"></td>

  </tr>

</table>

</body>

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
HTML верстка, верстка сайтов по стандартам w3c	napoleon1985	Вакансии	1	27.11.2012 16:49
HTML верстка, верстка сайтов по стандартам W3C	napoleon1985	HTML, CSS, JavaScript	3	24.10.2012 18:07
<table> or <frameset>	kIm	HTML, CSS, JavaScript	9	20.04.2009 19:34
Html Table	Sandro	HTML, CSS, JavaScript	1	02.10.2007 20:03
frame и table	апон	HTML, CSS, JavaScript	2	15.01.2004 16:38

28.04.2006, 14:41	#11
sl_play	я соглашусь только с одним, обычные статические странички или же дизайнерские решения - можно сделать и на слоях. Но если есть порталы, множественные выводы из базы - без таблиц вы всё-равно не обойдётесь.

30.04.2006, 16:58	#13
sl_play	никогда ты не сверстаешь нормальный диамический портал без таблиц!!!!! ты можешь сверстать сайт-визитку, какое-нибудь красивое дизайнерское решение не отличающееся большой сложностью и насыщенностью штмл. Напишите попробуйте кто-то форум без таблиц, или галерею! А я погляжу! подобная тенденция появилась в связи с тем, что верстать люди стали совершенно не прибегаю к дивам, разработчики этих самых дивов и выпустили в мир подобные слухи-статьи!

30.04.2006, 17:57	#17
nickspring	Сейчас попробую сверстать. А sl_play сделал бы на таблицах? Сравнили бы потом... nickspring добавил [date]1146406412[/date]: jsse , ну вот, ничего сложного: пример DIV-верстки на таблицах без вложенности наверняка не обошлось бы. nickspring добавил [date]1146406535[/date]: хех... надо же, еще и валидируется нормально + отображается корректно в Opera, Firefox, IE

30.04.2006, 18:38	#18
jsse	Открыл. Спасибо большое! Думаю, что на таблицах такой результат невозможно получить. -- P.S. Верстаем на DIV

30.04.2006, 18:42	#19
nickspring	вот скопировал прям из строки браузера : http://www.controlstyle.ru/trash/jsse/ все вроде нормально вот еще прямые ссылки на файлы: http://www.controlstyle.ru/trash/jsse/index.htm http://www.controlstyle.ru/trash/jsse/index.css nickspring добавил [date]1146408412[/date]: CSS: html, body {width:100%; height:100%; margin:0; padding:0} #global {width:100%; height:100%; text-align:justify} #left, #right {color:white; float:left} #left {background:blue; width:80%; height:70%} #right {background:red; width:20%; height:300px} HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru"> <head> <title>Example</title> <link rel="stylesheet" type="text/css" href="index.css" /> <style type="text/css"> <!-- @import url("index.css"); --> </style> </head> <body> <div id="global"> <div id="left">bla bla bla</div> <div id="right">bla bla bla</div> text text text text text text text text text text text text text text </div> </body> </html> бесконечную строку "text text text ... " - урезал, чтобы пост был короче

30.04.2006, 18:58	#20
sl_play	а ты однако юморист PHP код: `<body bottommargin="0" topmargin="0" leftmargin="0" rightmargin="0"> <table width="100%" height="100%" border="1" cellspacing="0" cellpadding="0"> <tr> <td rowspan="2" width="70%" bgcolor="#0033FF"></td> <td height="30%" bgcolor="#FF0000"></td> </tr> <tr> <td></td> </tr> <tr> <td colspan="2"></td> </tr> </table> </body>`