Заглавная страница Избранные статьи Случайная статья Познавательные статьи Новые добавления Обратная связь КАТЕГОРИИ: АрхеологияБиология Генетика География Информатика История Логика Маркетинг Математика Менеджмент Механика Педагогика Религия Социология Технологии Физика Философия Финансы Химия Экология ТОП 10 на сайте Приготовление дезинфицирующих растворов различной концентрацииТехника нижней прямой подачи мяча. Франко-прусская война (причины и последствия) Организация работы процедурного кабинета Смысловое и механическое запоминание, их место и роль в усвоении знаний Коммуникативные барьеры и пути их преодоления Обработка изделий медицинского назначения многократного применения Образцы текста публицистического стиля Четыре типа изменения баланса Задачи с ответами для Всероссийской олимпиады по праву Мы поможем в написании ваших работ! ЗНАЕТЕ ЛИ ВЫ?
Влияние общества на человека
Приготовление дезинфицирующих растворов различной концентрации Практические работы по географии для 6 класса Организация работы процедурного кабинета Изменения в неживой природе осенью Уборка процедурного кабинета Сольфеджио. Все правила по сольфеджио Балочные системы. Определение реакций опор и моментов защемления |
Основні теоретичні відомості
Зовнішні аркуші стилів записуються в окремих файлах і застосовуються для оформлення набору HTML-документів. Використання зовнішніх аркушів стилів дозволяє одноманітно оформляти множину Web-сторінок і навіть сайтів. Зручність зовнішніх стилів полягає також у тому, що автор Web-сторінок може змінювати стилі, не зачіпаючи змісту документів. CSS-файли У технології, що розглядається в даній роботі, опис стилів зберігається в окремому файлі, який має розширення.css (для стилів CSS) або.jss (для стилів JSSS - JavaScript Style Sheet, розроблених компанією Netscape). Такий файл є звичайним ASCII-файлом (як і HTML-файл). Для звернення до файлу зовнішніх стилів йому привласнюється ім'я, наприклад, style.css. Змістовна частина CSS-файлу складається тільки з аркуша стилів. Для пояснень у ці файли можуть включатися коментарі. Кількість правил, описуваних у файлі стилів, не обмежено. Приклад CSS-файлу:
P.red {font-weight: bold; color: red} SPAN {font-style: italic; font-size: 14pt} .yellow {background-color: yellow; font-family: Arial}
Як видно з прикладу, CSS-файл не містить яких-небудь заголовків або кінцевих елементів. Звертання до зовнішнього аркуша стилів (елемент LINK) Основним інструментом підключення до HTML-документа зовнішніх аркушів стилів є одиночний тег <LINK>. Цей тег розташовується в заголовній частині HEAD. До складу тегу <LINK> входить ряд атрибутів, з яких три є обов'язковими: · type ="text/ess" - указує браузеру, що застосовується, текст формату CSS. · href - задає URL-адресу файлу зовнішнього аркуша стилів. Якщо CSS-файл розташовується в тому ж каталозі, що й поточний документ, то вказується тільки ім'я файлу, наприклад, style.css. · rel=“stylesheet” - визначає відношення між поточним документом і об'єктом посилання href. Значення stylesheet указує на те, що елемент LINK установлює зв'язок із зовнішнім аркушем стилів.
Приклад:
<HTML> <HEAD> <TITLE>Назва сторінки</TITLE> <LINK rel="stylesheet" href = "http: //www.generaledu.org/ Styles/ mainst.ess " type = "text/css"> </HEAD> <BODY> <! -зміст документа -> </BODY> </HTML>
Зауваження Один елемент LINK установлює зв'язок тільки з одним CSS-файлом. Для звернення, наприклад, до трьох файлів, що містять аркуші стилів, у HTML-документ необхідно ввести три елементи LINK. Запис CSS-правил. Наступні прийоми запису CSS-правил спрощують запис та читання аркушів стилів.
1) Порядковий запис стильових властивостей. Такий запис стильових властивостей прийнятий для спрощення читання аркушів стилів. Прикладом порядкового запису стильових властивостей
Н2.blue { color: blue; font-family: Arial; text-align: right } 2) Скорочена форма запису. Такий запис стильових властивостей дозволяє призначати відразу кілька властивостей за допомогою одного ключового слова, наприклад, для властивостей шрифтів. Значення властивостей записуються після ключового слова font і впорядковуються у вигляді наступної послідовності:
font: font-style font-variant font-weight font-size/line-height font-family
Значення властивостей у скороченому записі представляються списком з одним розділовим символом - пробілом, наприклад:
DIV {font: italic small-caps bold 14pt/18pt serif}
Тут дві властивості, записані через косу риску, указують на розмір шрифту (font-size) і міжрядковий інтервал (line-height) відповідно. Пропущена в записі властивість приймає значення за замовчуванням. 3) Коментарі. Початок коментаря відзначається косою рискою із зірочкою (/*), а кінець - зірочкою з косою рискою (*/). Між цими символами розміщається будь-яке текстове повідомлення, наприклад:
/* Це аркуш стилів, оформлений окремим файлом */
Коментарі часто вставляються як перший рядок файлу з описом стилів. Вони використовуються також для тимчасового відключення правил або властивостей з аркуша стилів. Наприклад, щоб не змінювати запис стильового правила в цілому, можна закоментувати деякі властивості:
/* font-family:arial; font-style:italic;*/
4) Групування селекторів і визначень. Якщо відображення елементів задається однаковими CSS-правилами, то доцільно виконати групування селекторів. Наприклад, замість
H3 { font-family:sans-serif} H4 { font-family:sans-serif}
використовують
H3, H4 { font-family:sans-serif}
Групування визначень здійснюється шляхом перерахування визначень через крапку з комою. Наприклад, замість H2 {font-size: 11pt} H2{line-height: 12pt} H2{font-family: arial} H2{font-style: oblique}
використовують
H2{ font-size: 11pt; line-height: 12pt; font-family: arial; font-style: oblique}
Таким чином, групування селекторів відбувається шляхом їхнього перерахування через кому, а групування визначень - через крапку з комою.
|
|||||
Последнее изменение этой страницы: 2020-12-09; просмотров: 103; Нарушение авторского права страницы; Мы поможем в написании вашей работы! infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 18.190.156.212 (0.005 с.) |