Стилизация h2 по примеру (см.внутри)

@dionigi · Регистрация: 02.07.2012

Author24 — интернет-сервис помощи студентам

Приветствую!

Задача такая: имеется блок с фиксированной шириной, в блоке находится текст в теге h2. К тегу h2 прописан стиль где текст белого цвета а фон черного, текст выровнен по левому краю. Как сделать чтобы при переходе на новую строку фон текста обрывался и не заполнял строчку полностью до конца блока.
Пример нарисовал ниже, Спасибо!

@koza4ok · 25.10.2012, 13:33

тебе нужно чтобы каждый ряд текста был либо Float ,inline или inline-block.
Покажи код блока

@dionigi · 25.10.2012, 13:38 **[ТС]**

Сообщение от koza4ok

тебе нужно чтобы каждый ряд текста был либо Float ,inline или inline-block.
Покажи код блока

да именно так.

HTML5

1
2
3

<div id="htmlcaption" class="nivo-html-caption">
<h2></h2>
</div>

@Зверушь · 25.10.2012, 14:30

Цветовое оформление с селектора h2 удали. Вместо него напиши:

CSS

h2:first-line {
    color: black;
    background: white;
}

@dionigi · 25.10.2012, 14:56 **[ТС]**

Сообщение от Зверушь

Цветовое оформление с селектора h2 удали. Вместо него напиши:

CSS

h2:first-line {
    color: black;
    background: white;
}

бэкграунд применяется только к первой строке почему то...

@Зверушь · 25.10.2012, 15:44

Я видимо неверно понял какого эффекта вы пытаетесь добиться...

Vovan-VE · 25.10.2012, 19:56

HTML5

1 2	<h2><span>Lorem ipsum dolor sit amet consectepture adipisicing elit sed do eiusmod</span></h2>

CSS

h2 {
    border: #ccc solid 1px;
}
h2 span {
    line-height: 2em;
    background: #666;
    color: #fff;
}

@dionigi 0 / 0 / 0 Регистрация: 02.07.2012 Сообщений: 12
		1
	Стилизация h2 по примеру (см.внутри) 25.10.2012, 13:21. Показов 1394. Ответов 6 Метки нет (Все метки) Приветствую! Задача такая: имеется блок с фиксированной шириной, в блоке находится текст в теге h2. К тегу h2 прописан стиль где текст белого цвета а фон черного, текст выровнен по левому краю. Как сделать чтобы при переходе на новую строку фон текста обрывался и не заполнял строчку полностью до конца блока. Пример нарисовал ниже, Спасибо! Миниатюры 0

@koza4ok 632 / 440 / 67 Регистрация: 19.09.2012 Сообщений: 1,632
	25.10.2012, 13:33	2
	тебе нужно чтобы каждый ряд текста был либо Float ,inline или inline-block. Покажи код блока 0

@Зверушь 461 / 369 / 94 Регистрация: 01.05.2010 Сообщений: 1,761
	25.10.2012, 15:44	6
	Я видимо неверно понял какого эффекта вы пытаетесь добиться... 0

	25.10.2012, 19:56