Мы больше не используем раскладку таблиц, потому что они не являются семантическими. Боты и прошивки не могут определить, для чего подходит контент. Во-вторых, вы захотите отделить свой контент от кода для раскладки (распределение обязанностей).
Наличие внешнего файла CSS сделает вашу страницу более простой в обслуживании. Если у вас есть 20 + страницы, на которых есть таблица для хранения контента, вам, скорее всего, придется отредактировать все эти документы для редизайна. Если вы используете CSS и имеете хорошие идентификаторы ширины макета документа, вам нужно будет только изменить один .css-файл, чтобы изменить весь макет навсегда.
У вас возникли вопросы. Вы хотите иметь область содержимого под своим заголовком. Это нормально и действительно может быть разрешено с помощью более сложного CSS, если вы этого хотите, но не обязательно.
Во-первых, вы начнете ширину своего заголовка. Вы можете использовать для этого <div>
или использовать элементы заголовков (h1-h6). Как будто каждый бот узнает> «О, заголовок. Это важно!»
Позволяет структурировать документ:
<body>
<h1>Header</h1>
<div class="static-content">
<p>Content</p>
</div>
</body>
У нас есть заголовок и ширина Div имени класс «статический контент» по соображениям компоновки. Вы можете изменить это имя на то, что вы хотите (без пробелов и начала ширины буквенного символа) вы также можете добавить несколько классов, разделенных пробелами.
вот некоторые CSS
html, body {
height: 100%;
margin:0;
background-color: gray;
padding: 0;
}
h1
{
display: block;
padding: 20px 10px;
background-color: blue;
margin: 0px 0px 0px 0px;
}
.static-content
{
background-color: red;
padding: 10px;
margin: 0;
}
Зв Как вы можете видеть в скрипке здесь: http://jsfiddle.net/NicoO/rC66e/2/ Ваша область содержимого может быть красной (как есть). Но вы также видите серый фон. Элементом в фоновом режиме является body
, вы можете работать с телом, как почти любой div
.
Итак, вы видите, что вы уже растянули область содержимого в нижней части браузера. Если вы хотите, чтобы красная область также была внизу, у вас есть несколько вариантов для ее повторного использования.
См. Скрипку здесь: http://jsfiddle.net/NicoO/rC66e/3/ Есть и другие способы реализовать это.
Обновление.Если вы действительно хотите, чтобы красная область была большой, вы можете попробовать что-то вроде этого: http://jsfiddle.net/NicoO/rC66e/5/
Это не очень хорошее решение, потому что я не знаю, для чего вы хотите его использовать. Вы просто могли бы нарисовать элемент body
, и вам хорошо идти. Если вам нужен более сложный макет, вам придется добавить свой CSS. Soltion в этой скрипке не является общим, как должно быть. Но это показывает, что вы можете делать много вещей шириной CSS. Даже если вы действительно не показали нам ваш случай использования.
Редактировать: Вы продолжаете говорить: «Почему бы мне просто не зацепить таблицу из двух строк?». Но, с другой стороны, вы пытаетесь изменить это правило для ответа здесь. Почему бы вам просто не заголовок и абзац? например <h1>Title</h1><p>content</p>
Вы можете добавить фоновый цвет к элементу тела и сделать это. Здесь нет причин делать что-либо еще.
Окончательный Редактировать: У вас есть действительный пункт @John. иногда CSS может быть болью. Но он намного превосходит расположение таблиц. Для большинства распространенных проблем существуют такие инструменты, как выращенные сетчатые системы, которые устраняют большинство проблем. W3C работает над тем, чтобы сделать CSS более мощным и простым в использовании. Например, с новым дисплеем: сетка; имущество. Если вы действительно дадите css шанс и попробуйте добавить новый образец мышления о коробке, это очень поможет вам. С помощью HTML и CSS вы можете просто писать то, что вам нужно, без необходимости постоянно сталкиваться с неуклюжей таблицей. Прошу прощения, если я вас обидел. Но я бы посоветовал вам весить плюсы и минусы раскладки table vs css. Существует довольно хороший материал вокруг как адаптивным дизайном, что вы не сможете полностью использовать ширину эти старые методы
Sooo .. таблица макетов ... Да ... не делайте этого. (Да, я прочитал вопрос, просто нужно было сказать.) – Ruddy
«последнее дело в хип-хопе». :) Подождите, это 2003? Это глупый троллинговый пост. Если вы хотите использовать таблицы, выбивайте себя. – Will
Ruddy Как насчет таблиц для материала CSS не может делать или требует смехотворно глупых трюков? – John