Почему тег h1 отображается в элементе div, если задан тип документа? - PullRequest
Новая
       6

Почему тег h1 отображается в элементе div, если задан тип документа?

4 голосов
/ 25 октября 2008

У меня есть div с тегом <h1> в div, без полей. Если я определю какой-либо тип документа, над div появится пробел.

Если я удаляю теги <h1> или удаляю определение типа документа, пробела нет (как и должно быть. Почему?

Пример HTML: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <style>
        body { 
          margin:0
        }
        #thediv {
          background-color:green
        }
    </style>
</head>
<body>
    <div id="thediv">
        <h1>test</h1>
    </div>
</body>
</html>

Проблема в том, что пробел находится над зеленым div, удалите DOCTYPE и пробел исчезнет, ​​измените тег <h1> на <b> и пробел также исчезнет. Это происходит с любым типом документа (XHTML / HTML, строгий / переходный / и т. Д.)

Происходит почти во всех браузерах (при использовании http://browsershots.org). Забавно, но единственным браузером, который, кажется, правильно его отображал, был Internet Explorer 6.0 ..

Ответы [ 5 ]

7 голосов
/ 25 октября 2008

Пробел над зеленым div - это правильное поведение согласно CSS-спецификации . Это потому, что верхнее поле h1 примыкает к верхнему полю div.

Один из способов сохранить поле h1 внутри div - добавить границу к div: 

#thediv{ background-color:green; border: 1px transparent solid; }
3 голосов
/ 25 октября 2008

Скорее всего, это связано с режимом «причуд», который некоторые браузеры вызывают в отсутствие типа документа (или наличия искаженного типа).

Я бы предложил вам сбросить CSS вашей страницы и двигаться дальше. Жизнь слишком коротка.

1 голос
/ 25 октября 2008

DOCTYPE сигнализирует стандартный режим; Вот почему IE6 отображает его «правильно» (фактически неправильно), потому что его стандарты поддерживают отстой. По сути, в стандартном режиме он соответствует правилам макета CSS, как определено в спецификации, в отличие от того, что вы ожидаете («режим причуд»).

0 голосов
/ 25 октября 2008

У вас есть пара вопросов здесь:

  1. Отсутствие DOCTYPE заставляет браузеры использовать «режим причуд», а не интерпретировать ваш код в соответствии со стандартами. Это разработано для старого кода «тегового супа» - если вы пишете новый код, вы должны использовать DOCTYPE и проверить его.

  2. Браузеры могут предоставить «стили по умолчанию» для элементов HTML. Если вы хотите, чтобы ваша страница выглядела иначе, вы должны указать, как это сделать. На большинстве страниц как минимум указаны стили для элементов body и div. Вы также хотите управлять элементом h1, поэтому вам также нужно его стилизовать.

0 голосов
/ 25 октября 2008
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...