Отношение блочных и строчных элементов в коде

[Svatov]

<a><p></p></a>

Слышал, что на форуме Vlad говорил, что HTML5 допускает блочный в строчном элемент...хотя для меня это кажется все еще диким...где про это вообще можно прочитать? А вот интересно если например

<a></a>

p {display:inline} a {display:block}

То насколько эта запись корректна в XHTML и насколько в HTML5...просто учили что строчный всегда в блочном, хотя не объясняли, что будет с этим строгим правилом если их роли поменять через CSS

[troll]

<a><p></p></a>

Слышал, что на форуме Vlad говорил, что HTML5 допускает блочный в строчном элемент...хотя для меня это кажется все еще диким...где про это вообще можно прочитать?

По-моему, там отошли от понятий "блочный" и "строчный". Элементы теперь относят к определенным категориям, и у каждого элемента есть content model, определяющая, что может быть у него внутри.

[Gaspode]

То насколько эта запись корректна в XHTML

В XHTML она некорректна, стили тут вообще никак роли не играют. Потому что стили это не XHTML, как ни странно. Хотя работать, вероятно, будет о_О

[psywalker]

psywalker хотелось бы услышать твое мнение. Хоть балла на 2 тянет работа?

Конечно!

[cyklop77]

h1 нету

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

может быть и каруселью тогда не стоило заниматься?

Edited January 16, 2012 by cyklop77

[lexxcode]

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

может быть и каруселью тогда не стоило заниматься?

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

А вот слайдер это уже задача верстальщика. Ясное дело, что есть готовые плагины, но довести их внешний вид в соответствии с макетом можно под средством html и css. Программист, который будет натягивать верстку на движок, не должен заниматься вопросами верстки слайдера.

[SelenIT]

<a><p></p></a>

Слышал, что на форуме Vlad говорил, что HTML5 допускает блочный в строчном элемент...хотя для меня это кажется все еще диким...где про это вообще можно прочитать? А вот интересно если например

<a></a>

p {display:inline} a {display:block}

То насколько эта запись корректна в XHTML и насколько в HTML5...просто учили что строчный всегда в блочном, хотя не объясняли, что будет с этим строгим правилом если их роли поменять через CSS

В HTML5 <a> больше не строчный, а... похож на <ins> и <del> прежде (если сам внутри строчного, то допускает только строчное содержимое — точнее, "phrasing content" по-новому, если среди блоков, то может содержать блоки и внутри). Это по факту работает во всех браузерах вплоть до IE6. Прочитать можно, например, у HTML5-докторов.

А учили правильно. Более того, именно в CSS это правило особенно важно, т.к. там за правильной иерархией боксов (блочные только в блочных, рядом с блочными только блочные и т.п.) следить некому, кроме автора страницы (рендерер, конечно, выкрутится добавлением анонимных блочных боксов где надо, но не факт, что результат автору понравится. Вот только роли HTML-элементов CSS менять не может (CSS применяется к элементам уже отпарсенной DOM, и если парсер не допускает, к примеру, существования блочных элементов внутри <p>, то никакой CSS не поможет их туда затолкать — он приходит, когда их судьба уже решена).

Ну и про HTML5 troll всё верно написал...

[Svatov]

Я правильно понял, что если даже и прописать в CSS противоположные роли, то суть элементов изначальная не меняется и проходит валидацию, а меняется лишь их визуальное представление, взаимодействие с друг другом? Просто в голове не складывается, что будет, если так...основная логика визуального форматирования разрушается, когда насильно изначально блочному элементу меняют представление на inline, и внутрь помещают изначально строчных в блочном представлении.

Edited January 19, 2012 by Svatov

[SelenIT]

Именно так. Элементы парсятся с учетом их content model, а только потом к ним применяются стили. А валидаторы про стили вообще ничего не знают.

[Svatov]

Во, я понял, что именно меня смущает в этой ситуации Что это отследить очень трудно, ведь по сути валидацию документ проходит, а вот логика визуального оформления по спецификации разрушается, браузер будет же представлять информацию по своему усмотрению, исходя из ситуации.

Спасибо, SelenIT, который раз избавляешь от груза мыслей)

Edited January 19, 2012 by Svatov

[s0rr0w]

То насколько эта запись корректна в XHTML и насколько в HTML5...просто учили что строчный всегда в блочном, хотя не объясняли, что будет с этим строгим правилом если их роли поменять через CSS

Это не HTML5. Запись корректна

[Svatov]

Спасибо, что выделили в отдельную тему

Так вот, возвращаюсь к вопросу

Очень нужно допустим выделить заголовок (h1) в ссылку

пути:

1.забить на заголовок сделать просто ссылкой (<a>Текст</a>) ...о семантичности не может быть и речи

2.поместить строчную ссылку в блочный заголовок (<h1><a></a></h1>) ...вроде и акцент правильный, но смысл заголовка в таком случае как мне кажется теряется, как правило, для ссылки предопределяются другие стили...зато соблюдается строчность в блочности

3.обернуть заголовок ссылкой (<a><h1></h1></a>) таким нарушив концепт строчности в блочности...(мне допустим этот вариант кажется более логичным)

Ведь, если допустим надо обернуть в ссылку целые "блоки", а блоки могут себя представлять более сложные структуры, чем пару строчных элементов. Например, допустимо ли

<a href="#">
<span class=""></span>
<img src="image" alt=""/>
<span class="">Some tex</span>
<span>123456789</span>
<span class="">Some text</span>
</a>

где спаны выполняют декоративные (взять те же уголки для кросс) и смысловые функции.

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

Одним словом пока ситуация для меня не совсем прозрачна.

[s0rr0w]

2.поместить строчную ссылку в блочный заголовок (<h1><a></a></h1>) ...вроде и акцент правильный, но смысл заголовка в таком случае как мне кажется теряется, как правило, для ссылки предопределяются другие стили...зато соблюдается строчность в блочности

3.обернуть заголовок ссылкой (<a><h1></h1></a>) таким нарушив концепт строчности в блочности...(мне допустим этот вариант кажется более логичным)

var useVariant = ( version(html) < 5 )? 2 : 3;

Например, допустимо ли

Допустимо

[SelenIT]

В половине браузеров (FF 4+, Chrome 7+, на подходе Opera 12+ и IE 10+) "version(html) < 5" всегда false. По построению парсера. Так что, имхо, ставить короткий доктайп, юзать вариант 3 (никакой концепт это не нарушает, парсер позволяет, а "строчность и блочность" теперь все в CSS) и не переживать по поводу. А выкрутасы типа этого примера со спанами оставить истории.

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

Есть такое. Увы, за этим нужно следить самому — чтобы у всех элементов с display:block обязательно был контейнер с display:block, inline-block, table-cell или другим подходящим, а внутри элементов с display:inline был только текст или элементы с display:inline, inline-block или inline-table (если это нарушить — катастрофы не случится, браузер добавит анонимный бокс нужного типа, но управлять им станет намного сложнее).