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

35 Составное свойство margin. Пример.

Margin Устанавливает величину отступа от каждого края элемента.

Если у элемента нет родителя, отступом будет расстояние от края элемента до края окна браузера с учетом того, что у самого окна по умолчанию тоже установлены отступы. Чтобы от них избавиться, следует устанавливать значение margin для селектора <body> равное нулю.

margin: [значение | проценты | auto] {1,4} | inherit

1 Отступы будут установлены одновременно от каждого края элемента.

2 Первое значение устанавливает отступ от верхнего и нижнего края, второе — от левого и правого.

3 Первое значение задает отступ от верхнего края, второе — одновременно от левого и правого края, а третье — от нижнего края.

4 Поочередно устанавливается отступ от верхнего, правого, нижнего и левого края.

.parent { margin: 20%; /* Отступы вокруг элемента */ }

.child { margin: 10px; /* Отступы вокруг */ }

36 Свойства padding_top, padding_right, padding_left, padding_bottom. Пример.

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

padding-top: значение | inherit

.layer { padding-top: 10%; /* Поле сверху */ }

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

padding-right: значение | inherit

.layer { padding-right: 90px; /* Поле справа */ }

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

padding-left: значение | проценты | inherit

.layer p { padding-left: 10%; /* Поле слева */ }

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

padding-bottom: значение | inherit

.layer { padding-bottom: 40px; /* Поле снизу от текста */}

37 Составное свойство padding. Пример

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

Свойство padding позволяет задать величину поля сразу для всех сторон элемента или определить ее только для указанных сторон.

padding: [значение | проценты] {1, 4} | inherit

.layer { padding: 20px; /* Поля вокруг текста */ }

.layer1 { padding: 20px 10px 15px 7px; /* Поля вокруг текста */ }

1 Поля будут установлены одновременно от каждого края элемента.

2 Первое значение устанавливает поля от верхнего и нижнего края, второе — от левого и правого.

3 Первое значение задает поле от верхнего края, второе — одновременно от левого и правого края, а третье — от нижнего края.

4 Поочередно устанавливается поля от верхнего, правого, нижнего и левого края.

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