Главная | Обратная связь | Поможем написать вашу работу!
МегаЛекции

Пример 11.2. Изменение стиля абзаца




HTML5CSS 2.1IECrOpSaFx

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8" >

<title> Изменение стиля абзаца </title>

<style>

H2. sic {

font-size: 140%; /* Размер шрифта */

color: maroon; /* Цвет текста */

font-weight: normal; /* Нормальное начертание текста */

margin-left: 30px; /* Отступ слева */

margin-bottom: 0px; /* Отступ снизу */

}

H2. sic + P {

background: #ddd; /* Цвет фона */

margin-left: 30px; /* Отступ слева */

margin-top: 0.5em; /* Отступ сверху */

padding: 7px; /* Поля вокруг текста */

}

</style>

</head>

<body>

<h1> Методы ловли льва в пустыне </h1>

<h2> Метод последовательного перебора </h2>

<p> Пусть лев имеет габаритные размеры L x W x H, где L - длина льва

от кончика носа до кисточки хвоста, W - ширина льва, а H - его высота.

После чего пустыню разбиваем на ряд элементарных прямоугольников, размер

которых совпадает с шириной и длиной льва. Учитывая, что лев может находиться

не строго на заданном участке, а одновременно на двух из них, клетку для

ловли следует делать повышенной площади, а именно 2L x 2W. Благодаря

этому мы избежим ошибки, когда в клетке окажется пойманным лишь половина

льва или, что хуже, только его хвост. </p>

<h2 class="sic" > Важное замечание </h2>

<p> Для упрощения расчетов хвост в качестве погрешности измерения можно

отбросить и не принимать во внимание. </p>

<p> Далее последовательно накрываем каждый из размеченных прямоугольников

пустыни клеткой и проверяем, пойман лев или нет. Как только лев окажется в

клетке, процедура поимки считается завершенной. </p>

</body>

</html>


Результат данного примера показан на рис. 11.2.

Рис. 11.2. Изменение вида абзаца за счёт использования соседних селекторов

В данном примере текст отформатирован с применением абзацев (тег <p>), но запись H2.sic + P устанавливает стиль только для первого абзаца идущего после тега <h2>, у которого добавлен класс с именем sic.

Соседние селекторы удобно использовать для тех тегов, к которым автоматически добавляются отступы, чтобы самостоятельно регулировать величину отбивки. Например, если подряд идут теги <h1> и <h2>, то расстояние между ними легко регулировать как раз с помощью соседних селекторов. Аналогично дело обстоит и для идущих подряд тегов <h2> и <p>, а также в других подобных случаях. В примере 11.3 таким манером изменяется величина отступов между указанными тегами.

Поделиться:





Читайте также:





Воспользуйтесь поиском по сайту:



©2015 - 2024 megalektsii.ru Все авторские права принадлежат авторам лекционных материалов. Обратная связь с нами...