Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Плещёв ИП 2010-04-04 doc.doc
Скачиваний:
108
Добавлен:
13.05.2015
Размер:
5.96 Mб
Скачать

15.2.14. Листы стилей

Стиль представляет собой набор свойств (опций) редактирования. Су­щест­вуют три типа стилей (в порядке их применения): встраиваемые (вк­лю­че­­ние ат­рибутаStyle=”свойства”в нужный тег), внедряемые (ис­поль­­­зо­ва­­ние тега<STYLE>в разделе<HEAD>), связываемые (исполь­зо­ва­ние эта­лон­ного листа внедренных стилей для всего узла и хра­ня­щегося в файле с рас­ши­рением .css(mystyle.css)). Вызов фай­лаmystyle.cssимеет вид: <HEAD>...<LINKrel=stylesheethref=”mystyle.css”type=”text/css”> ...

Свойство стиля записывается в виде: {имя свойства: значение свой­ст­ва}. Несколько свой­ств можно объединить в список через символ точка с за­пятой. Перед внедряемым свойством или списком свойств ука­зы­вают­ся селекторы (имена тегов) через запятые, для кото­рых при­ме­няют­­ся эти свойства (H1,H2,H3 {font-family:sans-serif;font:14pt;color: #cccccc;}).

У всех свойств есть значение inherit, которое оз­на­чает, что прини­мает­ся значение родитель­ско­­го элемента.

Примерывстроенного и внедренного стиля соответственно.

<BODY STYLE=“{background-image: url('c:\WIN98\circles.bmp');}“>

<STYLE> body {background-image: url('c:\WIN98\circles.bmp');}</STYLE>

Свойства текста

Text-indent‑ длина отступа в первой строке блока (P{text-indent: 40px}).

Text-Align ‑ выравнивание: left, center, right, justify (P {text-align: right}).

Text-decoration ‑ оформление текста: none (отсутствует), underline (под­чер­ки­вание), overline (надчеркивание), line-through (перечеркивание), blink (мер­цание). Пример: P {text-declaration: underline}.

Text-transform ‑ перевод букв: none, capitalize (первая буква слова пропис­ная)­, uppercase/lowercase (прописные/строчные).

Text-indent, Margin-left, Margin-right, Margin-top, Margin-bottom ‑ отступ и поле абзаца слева, справа, сверху, снизу в пунктах (pt), сантиметрах (cm), дюймах (in) и пикселях (px) соответственно.

Letter-spacing/Word-spacing ‑ интервал между буквами/словами: none (по умолчанию), число (P {letter-spa­cing: 0.4em}).

White-space‑ обработка пробелов:normal(сворачиваются, если это необ­хо­димо для размещения элемента),pre(обрабатываются как указано в коде),nowrap(всегда сворачиваются).Пример: P {White-space: pre}.

Свойства цвета и фона

Color‑ цвет текста (DIV{color:rgb(0,0,255)}).

Background-image‑ фоновое изображение:none(нет),URL‑ адрес изобра­же­ния ({background-image: URL('c:\WIN98\circles.­bmp')}).

Background-repeat‑ направление заполнения экрана копиями фонового изображения:repeat(по горизонтали и вертикали),repeat-x(по гори­зон­та­ли),repeat-y(по вертикали),no-repeat(не повторяется).

Background-pozition‑ положение фонового изображения:top(вверху),cen­ter(в центре),bottom(внизу),left(слева),right(справа) ({Background‑pozi­­tion:topcenter}).

Background-attachment‑ прокрутка фонового изображения вместе с доку­мен­том (scroll) или фиксируется (fixed).

Backgroundустановка всех параметров фона сразу (P{backgroundblueURL('roza.gif')repeatfixedtopright}) .

Свойства шрифтов

Fontfamily‑ список названий шрифтов через запятые в порядке убывания приоритета. Многословные названия заключаются в кавычки (BODY{Font‑family: “TimeNewRoman”,courier,serif}).

Fontstyle‑ начертание:normal(обычное),italic(курсив),oblique(наклон).

Fontvariant‑ вывод строчными буквами (small-caps),normal(обычное).

Fontweigth‑ толщина шрифта:normal(обычная),bold(полужирные),bolder(жирный),lighter(светлый), число (толщина от 100 до 900).

Fontsize‑ высота шрифта:xx-small(очень маленький),small(маленький),me­dium(средний),large(большой),x-large(очень большой),xx-large(край­не большой),larger(больше),smaller(меньше), число ({font-size:16pt}).

Backgroundустановка всех параметров шрифта сразу (P{font:itlicbold16pt}) .