- •Синтаксис
- •Селектор класса (class)
- •Селектор идентификатора (id)
- •Комментарии css
- •Примеры использования css
- •Подключение таблицы стилей
- •Несколько таблиц стилей
- •Примеры
- •Параметры фона в css: подробное рассмотрение
- •Параметр 'background'
- •Параметр 'background-attachment'
- •Параметр 'background-color'
- •Параметр 'background-image'
- •Параметр 'background-position'
- •Параметр 'background-repeat'
- •Примеры
- •Параметр 'text-align'
- •Параметр 'text-decoration'
- •Параметр 'text-indent'
- •Параметр 'text-transform'
- •Параметр 'white-space'
- •Параметр 'word-spacing'
- •Параметры границы в css
- •Границы в css: подробное рассмотрение Параметр 'border'
- •Параметр 'border-bottom'
- •Параметр 'border-bottom-color'
- •Параметр 'border-bottom-style'
- •Параметр 'border-bottom-width'
- •Параметр 'border-color'
- •Параметр 'border-left'
- •Параметр 'border-left-color'
- •Параметр 'border-left-style'
- •Параметр 'border-left-width'
- •Параметр 'border-right'
- •Параметр 'border-right-color'
- •Параметр 'border-right-style'
- •Параметр 'border-right-width'
- •Параметр 'border-style'
- •Параметр 'border-top'
- •Параметр 'border-top-color'
- •Параметр 'border-top-style'
- •Параметр 'border-top-width'
- •Параметр 'border-width'
- •Примеры
- •Отступы в css
- •Отступы в css: подробное рассмотрение Параметр 'margin'
- •Параметр 'margin-bottom'
- •Параметр 'margin-left'
- •Параметр 'margin-right'
- •Параметр 'margin-top'
- •Примеры
- •Параметры полей в css
- •Поля в css: подробное рассмотрение Параметр 'padding'
- •Параметр 'padding-bottom'
- •Параметр 'padding-left'
- •Параметр 'padding-right'
- •Параметр 'padding-top'
- •Примеры:
- •Параметры списков в css
- •Списки в css: подробное рассмотрение Параметр 'list-style'
- •Параметр 'list-style-image'
- •Параметр 'list-style-position'
- •Параметр 'list-style-type'
- •Пример:
- •Параметры размеров элементов css
- •Размеры элементов в css: подробное рассмотрение Параметр 'height'
- •Параметр 'line-height'
- •Параметр 'max-height'
- •Параметр 'max-width'
- •Параметры форматирования в css: подробное рассмотрение Параметр 'clear'
- •Параметр 'cursor'
- •Параметр 'display'
- •Свойство 'float'
- •Параметр 'position'
- •Параметр 'visibility'
- •Примеры:
- •Параметры позиционирования в css
- •Параметры позиционирования в css: подробное рассмотрение Параметр 'bottom'
- •Параметр 'clip'
- •Параметр 'left'
- •Параметр 'overflow'
- •Параметр 'position'
- •Параметр 'right'
- •Параметр 'top'
- •Параметр 'vertical-align'
- •Параметр 'z-index'
Пример:
В примере показано, как увеличить интервал между строками.
<html>
<head>
</head>
<body>
<div>
Стандартный интервал между строками.<br>
Стандартный интервал между строками.
</div>
<br>
<div style="line-height: 0.4cm">
Уменьшенный интервал между строками.<br>
Уменьшенный интервал между строками.
</div>
<br>
<div style="line-height: 0.9cm">
Увеличенный интервал между строками.<br>
Увеличенный интервал между строками.
</div>
</body>
</html>
Параметры размеров элементов css
Данные параметры позволяют управлять высотой и шириной элемента, а также изменить межстрочный интервал.
Данные свойства поддерживаются следующими браузерами (в скобках сокращенный вариант, который применяется далее в таблицах параметров и значений): Internet Explorer (IE), Firefox (F), Netscape(N).
Параметр |
Описание |
Значения |
IE |
F |
N |
W3C |
height |
Задает высоту элемента |
auto |
4 |
1 |
6 |
1* |
length |
||||||
% |
||||||
line-height |
Задает интервал между строками |
normal |
4 |
1 |
4 |
1 |
number |
||||||
length |
||||||
% |
||||||
max-height |
Задает максимальную высоту элемента |
none |
- |
1 |
6 |
2 |
length |
||||||
% |
||||||
max-width |
Задает максимальную ширину элемента |
none |
- |
1 |
5 |
2 |
length |
||||||
% |
||||||
min-height |
Задает минимальную высоту элемента |
length |
- |
1 |
6 |
2 |
% |
||||||
min-width |
Задает минимальную ширину элемента |
length |
- |
1 |
6 |
2 |
% |
||||||
width |
Задает ширину элемента |
auto |
4 |
1 |
4 |
1 |
% |
||||||
length |
(* здесь и далее число в столбце "W3C" указывает в какой спецификации CSS определен параметр (CSS1 или CSS2)).
Размеры элементов в css: подробное рассмотрение Параметр 'height'
Используется для задания высоты элемента.
Наследование: нет.
Пример:
p
{
height: 50px
}
Может принимать следующие значения:
Значение |
Описание |
auto |
Браузер вычисляет реальную высоту |
length |
Определяет высоту в px, см, и т.д. |
% |
Определяет высоту в % от объемлющего блока |
Параметр 'line-height'
Используется для задания интервала между строками.
Наследование: Да.
Примечание: Отрицательные значения не допускаются.
Примеры:
div
{
line-height: 2.1
}
div
{
line-height: 10pt
}
div
{
line-height: 120%
}
Может принимать следующие значения:
Значение |
Описание |
normal |
Задает приемлемый интервал между строками |
number |
Задает число, которое при умножении на размер текущего шрифта задает интервал между строками |
length |
Задает фиксированный интервал между строками |
% |
Задает интервал между строками в % от размера текущего шрифта |