Как к разрыву строки из CSS, не используя <br/>?
вывод:
здравствуйте!
Как дела?
код:
<p>hello <br> How are you </p>
Как достигнуть того же вывода без <br>?
6 ответов
Невозможно с той же структурой HTML, у вас должно быть что-то различать между Hello и How are you .
Я предлагаю использовать HTML: CSS: span , которые затем будут отображаться в виде блоков (на самом деле, как <p><span>hello</span><span>How are you</span></p>
p span
{
display: block;
}
Вот плохое решение плохого вопроса, но оно буквально соответствует сути:
p {
width : 12ex;
}
p:before {
content: ".";
float: right;
padding-left: 6ex;
visibility: hidden;
}
Чтобы после этого элемент имел разрыв строки, назначьте его:
display: block;
Неплавающие элементы после элемента уровня блока появятся на следующей строке. Многие элементы, такие как
и
Но хотя это полезно знать, на самом деле это больше зависит от контекста вашего контента. В вашем примере вы не захотите использовать CSS для принудительного разрыва строки.
подходит, потому что семантически тег p является наиболее подходящим для отображаемого текста. Больше разметки просто для того, чтобы повесить CSS, не нужно. Технически это не точно абзац, но тега
Вы можете использовать white-space: pre; , чтобы элементы работали как , что сохраняет новые строки. Пример:
<style>
p {
white-space: pre;
}
</style>
<p>hello
How are you</p>
Обратите внимание, что это не работает в IE6 или IE7. Насчет IE8 не знаю.
Не надо. Если вам нужен жесткий разрыв строки, используйте его.
Ответы Винсента Роберта и Джои Адамса действительны. Однако, если вы не хотите изменять разметку, вы можете просто вставить с помощью javascript.
Невозможно сделать это в CSS без изменения разметки.