Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
css-лаб.doc
Скачиваний:
0
Добавлен:
01.07.2025
Размер:
266.75 Кб
Скачать

1.9.Розділ 9 - Інші властивості

1.9.1.page-break-after

Атрибут визначає розрив сторінки перед атрибутом.

Синтаксис:

селектор {page-break-after: значення}

може приймати значення:

  • auto.

  • right.

  • left.

  • always.

1.9.2.page-break-before

Атрибут визначає розрив сторінки після атрибуту.

Синтаксис:

селектор {page-break-before: значення}

може приймати значення:

  • auto.

  • right.

  • left.

  • always.

1.9.3.:first-line

Псевдоелемент визначає стиль для першого рядка блоку тексту

1.9.4.:first-letter

Псевдоелемент визначає стиль для першої букви в рядку.

Приклад завдання буквиці:

P:first-letter { font-size: 300%; font-style: italic; font-weight: bold; float: left }

1.9.5.:after

Псевдо елемент для вставки вмісту після елементу, що генерується

1.9.6.:before

для вставки вмісту до елементу, що генерується, Наприклад, наступне правило вставляє рядок "Пояснення: " перед вмістом кожного елементу SPAN, значення атрибуту class якого, рівне note:

SPAN.note:before { content: "Пояснення: " }

1.10.Розділ 10 - Групування стилів, призначення класів і псевдокласів

1.10.1.Групування стилів

Існують додаткові методи, які розширюють функціональні можливості таблиць стилів. Стилі можна згрупувати, що дозволяє зменшити кількість необхідних атрибутів і аргументів, шляхом створення логічних груп. Групування таблиць стилів може відбуватися по однакових тегах, або по атрибутах одного сімейства. Порядок атрибутів грає важливу роль: насиченість шрифту і стиль зображення повинні знаходитися перед рештою атрибутів - кегль повинен бути заданий до міжрядкового інтервалу, і тільки потім в рядок можна додати додаткову інформацію. У разі групування атрибутів - між ними коми не ставляться, виняток становить атрибут сімейства шрифту, перед ним ставиться кома.

Приклад групування по тегах:

До групування:

H1 {font-family: arial;font-size: 14pt}

H2 {font-family: arial;font-size: 14pt}

H3 {font-family: arial;font-size: 14pt}

Після групування:

H1,H2,H3 {font-family: arial;font-size: 14pt}

Приклад групування по атрибутах одного сімейства:

До групування:

BODY {margin-top: 12pt;margin-right: 10pt;margin-left: 15pt}

Після групування

BODY {margin: 12pt 10pt 15pt}

1.10.2.Призначення класів

Для того, щоб зробити роботу більш універсальною, можна створити декілька варіантів - класів властивостей стилів і застосовувати їх до елементів по черзі. Згрупувавши стилі по властивостях, необхідно дати їм назви в вигляді розширення до елементу.

Синтаксис:

H1.left {text-align: left}

H1.right {text-align: right}

Далі в документі указується або <H1 class=left>, або <H1 class=right>

Аналогічно можна створити універсальний клас і застосовувати його потім до різних елементів:

Синтаксис:

.left {text-align: left}

.right {text-align: right}

Далі в документі указується або <тег class=left>, або <тег class=right>

1.10.3.Призначення псевдокласів

Псевдокласи дозволяють задавати стиль елементу по його характеристиках, які не є ім'ям, атрибутом або вмістом. Елемент може придбати псевдоклас або позбутися його під час роботи користувача з документом.

  • A:link - не переглянуті посилання

  • A:visited - переглянуті посилання

  • A:hover - вибрані, але не активні посилання

  • A:active - активні посилання

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]