Авторский знак. Seosait21.ru Есть у человека надежда. Пока не поздно. Вгрызайся и изучай.
Нажимай и поддержи.

Пн Вт Ср Чт Пт Сб Вс
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28


Чувашия-это моя Россия

Блочные и внутристрочные элементы в CSS.

В (X)HTML разница между блочными и внутристрочными элементами связана с правилами вложения элементов: какие элементы( теги) будут содержаться внутри других элементов( теги). Блочные элементы могут содержать как блочные, так и внутристрочные элементы, в то время как внутристрочные элементы могут содержать только данные или другие внутристрочные элементы. Абзацы р , заголовки h, списки ol, ul, dl и элементы div являются наиболее распространенными блочными элементами. Однако даже некоторые из блочных элементов должны подчиняться особым правилам (X)HTML: например, абзацы, заголовки и адреса < address> могут содержать только внутристрочные элементы. Выделенный текст em и анкеры а являются примерами распространенных внутристрочных элементов. Разметка, где абзац p вкладывается в элемент a анкер, будет неверной, но в некоторых браузерах данное сочетание будет выдавать интересный эффект. Но, экспериментировать тем, что явно не рекомендуется смысла нет. Стоит ли лезть туда и тратить на тестирование время, зная что специалисты это не одобряют.

Однако в CSS понятия «блочный» и «внутристрочный» относятся только к представлению; block и inline представляют собой две возможные роли отображения элементов, которые используются для того, чтобы указать пользовательскому агенту, как следует представлять элемент в раскладке. Заметьте, вроде ничего не написано, но, какое важное замечание сделано. В дальнейшем на основе этих выкладок будут прозводиться удивительные превращения элементов. Например, взять абзац p. Ведь прывыкли его представлять как внутристрочный элемент и тем самым привязали себя уже к некоторым ограничениям. Но, кто нам запрещает объявить абзац p как ( display: block). Он имеет все характеристики блока. Ну. ладно, всему свое время.

Роли отображения присваиваются при помощи свойства display. Блочный элемент CSS (display: block) всегда создает разрыв строки до и после себя. Он занимает всю ширину родительского элемента, в котором он содержится, будь это ширина всего документа сайта (для элемента body) или меньшее пространство, например элемент div с заданным размером. В нормальном потоке текста рядом с блочным элементом разместить ничего нельзя. Вот, это запомнить надо.

Внутристрочные элементы CSS (display: inline) не создают разрывов строки. Они появляются внутри строки, и разрыв происходит, только если ширины родительского элемента не хватает, и тогда материал переносится на следующую строку.

В отличие от блочных и внутристрочных элементов (X)HTML блочный элемент CSS может вкладываться во внутристрочный элемент, и наоборот. При использовании CSS любой (X)HTML элемент может быть как блочным, так и внутристрочным.

Для свойства display существуют и другие значения.

Значение none. Наиболее распространенным и хорошо поддерживаемым является значение none, при указании которого элемент не отображается вообще и, по сути, удаляется из потока.

Значение list-item. К другим значениям относятся list-item (сходно со значением block, но отображается с номером или маркером).

Значение run-in. Блочный элемент, например заголовок, начинает входить в следующий элемент, например абзац, а также ряд ролей отображения, связанных с таблицами.

Стоит отметить, что элементы, определенные как блочные в (X)HTML, как правило, при отображении в браузерах по умолчанию имеют представление display: block. Точно так же для внутристрочных HTML-элементов принята по умолчанию роль отображения display: inline. Существует возможность изменить принятые по умолчанию роли отображения (Х)НТМL-элементов при помощи CSS-свойства display. Фактически превращение пунктов списка li во внутристрочные элементы вместо блочных (по умолчанию) является распространенной практикой дизайна. Однако помните, что изменение представления HTML-элемента средствами CSS не изменяет определения этого элемента как блочного или внутристрочного в HTML. Помещение блочного элемента во внутристрочный в (X)HTML всегда будет неправильным, независимо от роли отображения. Хотя элементы (X)HTML имеют заданные по умолчанию роли отображения, элементы других XML-языков, как правило, таких ролей не имеют. Свойство display можете применять для явного объявления ролей отображения для отдельных элементов.


seosait21.ru
HTML

seosait21.ru
CSS

seosait21.ru
Web-диз.
HTML ссылка CSS ссылка ...

seosait21.ru
JavaScript

seosait21.ru
PHP

seosait21.ru
JQuery
JavaScript ссылка PHP ссылка JQuery ссылка

seosait21.ru
SEO.

seosait21.ru
MySQL

seosait21.ru
XML
... ... ...

обратно на главную     назад    дальше     вперед

ПОНРАВИЛОСЬ?
ПОДЕЛИСЬ с ДРУЗЬЯМИ: