Задачка на смекалку:
Есть тег p такого вида
<p> <br/> Тут текст <br/> Ещё текст ... </p> и такого: <p> Тут текст <br/> Ещё текст ... </p> Задача - по возможности убить c помощью css тег <br/> (oтступ) в начале первой строки визуально; (не убивая <br/>, которые могут быть далее по тексту) Теги <p> как первого так и второго типа на странице расположены произвольно (как кол-во так и последовательность) |
p:first-line{
line-height:0;
}
|
а можно проще:
p br:first-child {
display: none;
}
|
EmperioAf,
1. Есть и теги <p> без <br> в первой строке 2. В псевдо элементе :first-line допустимы только изменения правил для правил font и line-height Проверка:
<!DOCTYPE html>
<html>
<head>
<style>
body{
margin:0;
padding:0;
}
p {
border:blue solid 1px;
}
p:first-line{
line-height:0;
}
</style>
</head>
<body>
<!-- Вариант-1 тега <p> -->
<p>
<br/>
Тут текст - 1 <br>
Еще текст
</p>
<!-- Вариант-2 тега <p> -->
<p>
Тут текст - 2 <br>
Еще текст
</p>
</body>
</html>
|
не понял, почему нельзя написать так:
p *:first-child {
display: none;
}
? |
EmperioAf,
Для второго тега <p> - убъётся перевод строки |
Deff,
:-?
<!DOCTYPE html>
<html>
<head><meta charset="utf-8">
<style>
body{
margin:0;
padding:0;
}
p {
border:blue solid 1px;
}
p > br{
display: none;
}
</style>
</head>
<body>
<p>
<br/>
Тут текст - 1
</p>
<p>
Тут текст - 2 <br>
Еще текст
</p>
</body>
</html>
|
Deff,
или надо так?
<!DOCTYPE html>
<html>
<head><meta charset="utf-8">
<style>
body{
margin:0;
padding:0;
}
p {
border:blue solid 1px;
}
p:first-of-type > br{
display: none;
}
</style>
</head>
<body>
<p>
<br/>
Тут текст - 1
</p>
<p>
Тут текст - 2 <br>
Еще текст
</p>
</body>
</html>
|
рони, поставил бы + (2-й твой) Если б мог
Но теги <p> (как Вариантов 1, так и 2) рандомно разбросаны по странице, хитрость не проходит |
Цитата:
|
| Часовой пояс GMT +3, время: 15:00. |