Почему этот HTML не работает?

Question

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

<style type="text/css">

span.post-content {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
}

</style>

<p><span class="post-content"> Some text here <p/> From here text loses style and adopts browser default <p/> same here </span></p>

Это работает во всех браузерах, кроме основанных на Webkit: chrome и safari.

Answer 1

Примером является неверно . Исправьте ошибки, и проблема, скорее всего, исчезнет.

1. Элемент span не может включать элемент p
2. В HTML <p/> не означает, что вы, вероятно, думаете, что означает
3. <p/> не допускается в HTML-совместимом XHTML
4. В XHTML <p> может не содержать <p> (ни в HTML, но конечный тег необязателен, поэтому <p>foo<p>bar допустим и означает <p>foo</p><p>bar)

Вы, вероятно, хотите что-то подобное (и изменить CSS для ссылки на измененный тип элемента)

<div class="post-content">
    <p>Some text here</p>
    <p>From here text loses style and adopts browser default</p>
    <p>same here</p>
</div>

Answer 2

Вы всегда можете проверить свой (X) HTML-код здесь:

validator.w3.org

Или в браузере Opera быстрее: щелкните правой кнопкой мыши -> Подтвердить

Answer 3

Может быть, вы начнете с написания хорошо структурированного HTML, а затем посмотрите, есть ли проблемы.

Answer 4

Как сказал Дэвид: span не может содержать p - то есть, может - но это не имеет смысла - потому что span это тип отображения INLINE, а p это тип BLOCK. Элемент span - это строка внутри блока ...

как сказал Бен: концепции должны быть поняты - структурированы или нет