Универсальный селектор *

Универсальный селектор *.

Начнем с простейших правил, которые обеспечат единообразие дизайна.

Листинг 2.26. Общее правило CSS * {

Margin: 0px; padding: 0px;

}

Обычно приходится для большинства элементов в документе настраивать размер поля или, по крайней мере, пытаться минимизировать его. Поля некоторых элементов по умолчанию ненулевой ширины и иногда оказываются даже слишком большими. По мере разработки дизайна мы убедимся в том, что нулевая ширина полей лучше всего подходит почти для любого элемента. Для того чтобы избежать необходимости в дублирующихся стилях, здесь удобно применить универсальный селектор * («звездочка»), с которым мы познакомились ранее.

Первое правило для CSS-файла, показанное в листинге 2.26, гарантирует, что у всех элементов поля будут нулевой ширины. Дальше в коде будем модифицировать поля только в том случае, если для конкретного элемента их ширина должна быть больше нуля.

Помните, что каждый элемент считается отдельным блоком? Поле элемента — это пространство вокруг данного элемента, то есть лежащее за пределами блока. (Забивка — это пространство вокруг содержимого элемента, но внутри блока, например между заголовком и границей виртуальной рамки, определяемой элементом <h1> для этого заголовка.

Мы подробнее поговорим о забивке далее в этой главе.) Размер поля можно определять сразу для всех сторон элемента или для каждой стороны отдельно. Правило margin: 0px в нашей таблице стилей определяет нулевую ширину полей со всех сторон вокруг блока. Если бы мы указали значение 5 пикселов, то блок был бы окружен пустым пространством шириной 5 пикселов, то есть от соседних блоков его всегда отделяло бы поле размером 5 пикселов.

Будем записывать все необходимые правила CSS в файле, содержащем таблицу стилей. Мы уже указали ссылку на этот файл в «голове» HTML-кода в теге <link>, поэтому вам всего лишь нужно создать в любом текстовом редакторе новый пустой файл под названием mystyles. css и скопировать туда правило из листинга 2.26. В дальнейшем вы будете копировать туда правила из следующих листингов.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *