CSS-свойства: фон, оформление таблиц

Фон

Как и в языке HTML, в CSS фоном служит заливка цветом или изображение. Фоновое изображение может быть повторяющимся.

background-color – устанавливает цвет фона. Пример: TD.head {background-color: #ffff00}

background-image – устанавливает в качестве фона изображение: BODY {background-image: url(images/bg.jpg)}

background-attachment – задает поведение фонового изображения при прокрутке. По умолчанию задается значение scroll – фон прокручивается вместе с содержимым. Значение fixed делает фон неподвижным.

background-position – начальное положение фонового изображения по горизонтали (left, center, right) и вертикали (top, center, bottom). Вместо ключевых слов можно указывать расстояние в пикселях или процентах.

background-repeat – указывает, в каком направлении должно размножаться фоновое изображение:

repeat – по горизонтали и вертикали (по умолчанию);

repeat-x – только по горизонтали;

repeat-y – только по вертикали;

no-repeat – отключить повторение

Многоуровневые списки

Стилевое свойство counter-increment предназначено для увеличения значения счетчика приращений, который задается свойством counter-reset. Такой счетчик подсчитывает количество отображений элементов на странице и может выводиться с помощью свойства content и псевдоэлементов :after и :before. Это позволяет создавать списки (в том числе многоуровневые), в которых нумерация и вид задаются через стили.

Значения

none

Запрещает увеличение счетчика для текущего селектора.

inherit

Наследует значение родителя.

идентификатор

Задает одну или несколько переменных, для которых требуется изменить значение счетчика. Переменные разделяются между собой пробелом.

целое число

Определяет значение приращения счетчика. По умолчанию оно равно 1. Допускается использовать отрицательные и нулевые значения.

Пример

<html>

<head>

<title>counter-increment</title>

<style type="text/css">

BODY {

counter-reset: heading; /* Инициируем счетчик */

}

H2:before {

counter-increment: heading; /* Указываем идентификатор счетчика */

content: "Глава " counter(heading) ". "; /* Выводим текст перед содержимым тега <H2> */

}

</style>

</head>

<body>

<h2>Теория информационных технологий</h2>

<h2>Метод наименьших квадратов</h2>

<h2>Основы JAVASCRIPT </h2>

</body>

</html>

Counter-reset

counter-reset: none | inherit | идентификатор | целое число


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: