Я хочу сделать что-то вроде этого:
<p>This is a <h2>text</h2> paragraph.</p>
Я отключил поле и добавление для h2, но он все еще разбивает строку до и после тега h2. Как я могу использовать тег h2 в середине текста и сделать его похожим, если это нормальное слово, как и <b> делает?
Допитом моего html-документа является "XHTML 1.0 Transitional"
Не рекомендуется использовать тег, который означает "заголовок" в тексте тела. Тегами <h..> являются логические теги; их использование придает смысл прилагаемому тексту, а именно, что текст является заголовком раздела.
Хотя вы можете использовать атрибут display: inline, подумайте об использовании более подходящего тега или даже тега <span>.
Недопустимо иметь h2 внутри p.
Помимо этого и для ответа на ваш вопрос, h2 является элементом уровня block. Создание элемента уровня inline приведет к тому, что он будет вести себя аналогично тому, как вы описываете действующий тег b.
p h2{display:inline}
Как я уже сказал выше, HTML, который вы указали, недействителен.
Не надо, все дело в том, что это заголовок. Заголовки находятся на одной линии. Вместо этого используйте CSS. Скажите текст, а затем в файле CSS, выберите размер шрифта.
Вам нужно сделать это
display:inline;
h2 является блочным элементом.
Тег h2 помещает заголовок, который по определению не является частью текста. Так что вы делаете, вероятно, не самый лучший способ. Подумайте об этом по-другому.
Создайте класс как .myH2 (не лучшее имя) с тем же кодом h2 и используйте span в p как
<p>this is <span class="myH2">myH2</span>.</p>
Несмотря на неправильное использование тега <h2> внутри абзаца, мы можем создать стиль <h2>, чтобы держать его в абзаце. Я протестировал один из вышеперечисленных трюков CSS в Firefox и Chrome следующим образом:
HTML-код <p>One paragraph with <h2>title text</h2> in the middle</p>
CSS трюк p h2{display:inline}
НО он не получит ожидаемого результата. Браузер усекает абзац прямо перед исходным тегом h2. Посмотрите DOM из Firebug:
Поэтому трюк CSS p h2{display:inline} работает некорректно, потому что правило CSS неверно, т.е. тег <h2> находится не внутри тега <p>. Это выглядит так:
Добавление трюка CSS только для тега <h2> h2{display:inline} не является окончательным решением. Он будет выглядеть следующим образом:
Окончательный вариант:
HTML-код <p class="inline-object">One paragraph with <h2 class="inline-object">title text</h2> in the middle</p>
CSS трюк .inline-object" {display:inline}
Это будет выглядеть так, как мы ожидаем:
Если вы пытаетесь замаскировать текст заголовка <h2> как обычный текст, просто добавьте еще два правила в класс .inline-object" {display:inline;font-size: inherit;font-weight: normal;}
Firefox вырезает мой P из-за H2 внутри него. А затем создав P для
(пустой абзац). И это хорошо. Поскольку он автоматически генерируется, и для очистки тэгов P мне нужно написать десятки PHP-кода.