Свойства таблиц

Свойство	Описание
border-collapse	Задает, будут ли границы ячеек и общая граница таблицы сливаться в одну или нет. border-collapse: separate\|collapse; separate - разделяет границу таблицы и границы ее ячеек (значение по умолчанию); collapse - объединяет их.
border-spacing	Задает расстояние между границами ячеек в таблице border-spacing: значение1 [значение2] Одно значение устанавливает одновременно расстояние по вертикали и горизонтали между границами ячеек. Если значений два, то первое определяет горизонтальное расстояние, а второе – вертикальное.
caption-side	Определяет положение заголовка таблицы, который задается с помощью тега <caption> относительно самой таблицы. caption-side: top \| bottom top – располагает заголовок по верхнему краю таблицы. bottom – заголовок располагается под таблицей. right – заголовок размещается справа от таблицы. Корректно для CSS 3. Это значение работает только в браузерах Firefox. left – заголовок размещается слева от таблицы. Корректно для CSS 3. Это значение работает только в браузерах Firefox.
empty-cells	Задает отображение границ и фона в ячейке, если она пустая. При одновременном добавлении к таблице свойства border-collapse со значением collapse, свойство empty-cells игнорируется. empty-cells: show \| hide show – отображает границу вокруг ячейки и фон в ней. hide – граница и фон в пустых ячейках не отображается. Если все ячейки в строке пустые, то строка прячется целиком.
table-layout	Определяет, как браузер должен вычислять ширину ячеек таблицы, основываясь на ее содержимом. table-layout: auto \| fixed \| inherit auto – браузер загружает всю таблицу, анализирует ее для определения размеров ячеек и только после этого отображает. fixed – ширина колонок в этом случае определяется либо с помощью тега <col>, либо вычисляется на основе первой строки. Если данные о форматировании первой строки таблицы по каким-либо причинам получить невозможно, в этом случае таблица делится на колонки равной ширины. При использовании этого значения, содержимое, которое не помещается в ячейку указанной ширины, будет «обрезано» либо наложено поверх ячейки. Это зависит от используемого браузера, но в любом случае ширина ячейки меняться не будет. Для корректной работы этого значения обязательно должна быть задана ширина таблицы. inherit – наследует значение родителя.

Псевдоклассы

Для управления цветом ссылок с помощью стилей предлагается использовать псевдоклассы. Псевдоклассы применяются в CSS, чтобы определять стиль элемента при изменении его состояния. Общий синтаксис для ссылок будет такой:

А:псевдокласс { параметр: значение }

Свойство	Описание
:active	Применяется к активным гиперссылкам, т.е. гиперссылкам, на которых находится фокус ввода пользователя (аналогичен атрибуту alink тега <BODY>): {Задание стиля гиперссылки}:active {Определение стиля}; Пример: a:active {color: lime;}
:first-child	Применяет стилевое оформление к первому дочернему элементу своего родителя. элемент:first-child { ... }
:focus	Псевдокласс :focus определяет стиль для элемента получающего фокус. Например, им может быть текстовое поле формы, в которое устанавливается курсор. элемент:focus { ... }
:hover	Применяется к гиперссылкам, когда пользователь помещает над ними курсор мыши: {Задание стиля гиперссылки}:hover {Определение стиля}; Пример:a:hover {color: lime; text-decoration: none;} Гиперссылка, при наведении на нее мыши, будет ярко-зеленой и неподчеркнутой.
:lang	Определяет язык, который используется в документе или его фрагменте. элемент:lang(<язык>) { ... } В качестве языка могут выступать следующие значения: ru – русский; en – английский ; de – немецкий; fr – французский; it – итальянский и др.
:link	Применяется к не посещенным еще пользователем гиперссылкам (аналогичен атрибуту link тега <BODY>): {Задание стиля гиперссылки}:link {Определение стиля}; Пример:a:link {color: black;}
:visited	Применяется к уже посещенным пользователем гиперссылкам (аналогичен атрибуту vlink тега <BODY>) {Задание стиля гиперссылки}:visited {Определение стиля}; Пример:a:link {color: indigo;}

Различают следующие псевдоклассы, имеющие отношение к ссылкам:

active – применяется к активным гиперссылкам, т.е. гиперссылкам, на которых находится фокус ввода пользователя (аналогичен атрибуту alink тега <body>):

{Задание стиля гиперссылки}:active {Определение стиля};

hover - применяется к гиперссылкам, когда пользователь помещает над ними курсор мыши:

{Задание стиля гиперссылки}:hover {Определение стиля};

link - применяется к не посещенным еще пользователем гиперссылкам (аналогичен атрибуту link тега <body>):

{Задание стиля гиперссылки}:link {Определение стиля};

visited - применяется к уже посещенным пользователем гиперссылкам (аналогичен атрибуту vlink тега <body>)

{Задание стиля гиперссылки}:visited {Определение стиля};

Пример:

<html>

<head>

<title> Псевдоклассы для ссылок</title>

a:link {color : lime}

a:visited {color: indigo }

a:hover {color: red }

a:active {color : #fe0 }

</style>

</head>

<body>

<a href=linkl.html>Ссылка 1</a>

<a href=link2.html>Ссылка 2</a>

<a href=link3.html> Ссылка 3</a>

</body>

</html>

<<< < Предыдущая 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 7071 / 7871 72 73 74 75 76 77 78 > Следующая >>>

Соседние файлы в папке example1

#
18.05.20153.57 Кб50index.php
#
18.05.20153 Mб101Введение в PHP.doc