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

6 Применение стиля при помощи id. Пример.

Задает стилевой идентификатор — уникальное имя элемента, которое используется для изменения его стиля и обращения к нему через скрипты. Идентификатор в коде документа должен быть в единственном экземпляре, иными словами, встречаться только один раз.

#Имя идентификатора {свойство1: значение; свойство2: значение; …}

Пример

#help {

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

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

}

<div id="help">…</div>

7 Создание селекторного класса. Особенности применения селекторного класса. Пример.

Классы применяют, когда необходимо определить стиль для индивидуального элемента веб-страницы или задать разные стили для одного тега. При использовании совместно с тегами синтаксис для классов будет следующий.

Тег.Имя класса { свойство1: значение; свойство2: значение; ... }

P.cite { /* Абзац с классом cite */

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

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

В качестве селектора используется класс, привязанный к определенному тегу (например, p.first {...})

8 Создание безселекторного класса. Особенности применения безселекторного класса. Пример.

Использовать классы и без указания тега. Синтаксис в этом случае будет следующий.

.Имя класса { свойство1: значение; свойство2: значение; ... }

.term { border-bottom: 1px dashed red; /* Подчеркивание под текстом */ }

<b class="term">…</b>р

А здесь - класс, но БЕЗ тега ( .first {..})

9 Раскройте смысл использования знака > при наследовании CSS. Приведите пример.

Дочерним называется элемент, который непосредственно располагается внутри родительского элемента. Стиль к дочернему селектору применяется только в том случае, когда он является прямым потомком, иными словами, непосредственно располагается внутри родительского элемента. Для контекстного селектора же допустим любой уровень вложенности.

пример:

DIV I { /* Контекстный селектор */

color: green; /* Зеленый цвет текста */

}

P > I { /* Дочерний селектор */

color: red; /* Красный цвет текста */

}

10 Раскройте смысл использования пробела при наследовании стилей css. Приведите пример

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

.red {color: #f33;}

.bold {font-size: 20px;}

<p class="red bold">жажажа</p>

выведет красную "жажу" размером 20px

11 Единицы измерения в css

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

em Высота шрифта текущего элемента

ex Высота символа x

px Пиксел

% Процент

Абсолютные единицы

Абсолютные единицы применяются реже, чем относительные и, как правило, при работе с текстом.

in Дюйм (1 дюйм равен 2,54 см)

cm Сантиметр

mm Миллиметр

pt Пункт (1 пункт равен 1/72 дюйма)

pc Пика (1 пика равна 12 пунктам)

12 Свойства text_decoration, text_align. Пример

text_decoration

Добавляет оформление текста в виде его подчеркивания, перечеркивания, линии над текстом и мигания. Одновременно можно применить более одного стиля, перечисляя значения через пробел.

text-decoration: [ blink | line-through | overline | underline ] | none | inherit

blinkУстанавливает мигающий текст. Такой текст периодически, примерно раз в секунду исчезает, потом вновь появляется на прежнем месте (пример).

line-throughСоздает перечеркнутый текст (пример).

overlineЛиния проходит над текстом (пример).

underlineУстанавливает подчеркнутый текст (пример).

Пример

a { text-decoration: none; /* Убираем подчеркивание у ссылок */ }

text_align Определяет горизонтальное выравнивание текста в пределах элемента.

text-align: center | justify | left | right | inherit

Пример

#left { text-align: left; }

#right { text-align: right; }

#center { text-align: center; } </style>

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