Большой архив статей, книг, документации по программированию, вебдизайну, компьютерной графике, сетям, операционным системам и многому другому
 
<Добавить в Избранное>    <Сделать стартовой>    <Реклама на сайте>    <Контакты>
  Главная Документация Программы Обои   Экспорт RSS E-Books
 
 

   Интернет технологии -> CSS -> Таблица свойств CSS


Таблица свойств CSS

Параметры

Возможные значения:

Применимо для

Описание

Примеры

Свойства font

font-family

 [1] любой шрифт

всех элементов

это свойство определяет используемый элементом шрифт. Если указать URL, то шрифт автоматически установится на компьютер пользователя

font-family:Arial Black URL('arialblack.ttf')

font-style

[1] normal - без изменений
[2] italic – курсив

всех элементов

стиль элемента. Курсивный или обычный

font-style:italic

font-variant

[1] normal - без изменений
[2] small-caps - заменяет все маленькие буквы на большие

всех элементов

варианты отображения шрифта. Нетскейп не поддерживает это свойство

font-variant:small-caps

font-weight

[1] normal - без изменений
[2] bold - жирный
[3] bolder - очень жирный (в MSIE не отличается от bold, в Нетскейпе от нормал)
[4] lighter - тонкий (не отличается от normal)
[5] любое значение от 100 до 900

всех элементов

выделение (жирность) элемента

font-weight:bold

font-size

[1] размер (+)
[2] xx-small, x-small, small, medium, large, x-large, xx-large - любое из этих значений
[3] smaller, larger - любое из этих значений

всех элементов

размер шрифта

font-size:30pt

font

 

[1] font-family
[2] font-style
[3] font-variant
[4] font-weight
[5] font-size

всех элементов

обобщает вышеперечисленные свойства

font: italic bolder Arial 12pt

Свойства Text

text-decoration

[1] none - нет
[2] underline - подчеркнутый
[3] overline - надчеркнутый (не поддерживается в Нетскейпе)
[4] line-through - перечеркнутый
[5] blink - мигающий (не поддерживается в IE)

всех элементов

"украшение" текста

text-decoration:line-through

letter-spacing

[1] длина (+)
[2] normal - без изменений

всех элементов

расстояние между буквами. Не работает в Нетскейпе

letter-spacing:100

vertical-align

[1] baseline
[2] sub
[3] super
[4] top-text
[5] top
[6] middle
[7] bottom
[8] bottom-text
[9]
процент

inline элементов

позиционирование элементов по отношению к другим элементам стоящих в одном ряду. Не работает в Нетскейпе

vertical-align:top-text

Параметры

Возможные значения:

Применимо для

Описание

Примеры

text-transform

1] none - нет
[2] Capitalize - каждое слово начинается с большой буквы
[3] UPPERCASE - каждая буква текста становится заглавной
[4] lowercase - каждая буква текста становится маленькой

inline элементов

изменение текста. Не работает в Нетскейпе

text-transform:Capitalize

text-align

[1] left - текст слева
[2] right - текст справа
[3] center - текст по центру
[3] justify - текст по ширине

block-level элементов

положение текста

text-align:right

text-indent

[1] длина (+)
[2] процент (+)

block-level элементов

отступ

text-indent:30 em

line-height

[1] normal - без изменений
[2] длина (+)
[3] процент

всех элементов

междустрочный интервал

line-height:100%

Свойства Color и Background

Color

[1] цвет (+)

всех элементов

цвет элемента

color:#f00000

background-color

[1] цвет (+)

transparent

всех элементов

цвет фона элемента

background-color:#f00000

background-image

[1] none - нет
[2] URL (+)

всех элементов

фоновое изображение для элемента

background-image:URL(cool.gif)

background-repeat

[1] repeat - размножает фоновое изображение во всех направлениях
[2] repeat-x - размножает фоновое изображение горизонтально
[3] repeat-y - размножает фоновое изображение вертикально
[4] no-repeat - не повторяющиеся изображение

всех элементов

повторения фонового изображения

background-repeat:no-repeat

background-attachment

[1] scroll - фоновое изображение скроллится всесте с содержанием документа
[2] fixed - не скроллится. Фиксируется в одном месте. Не работает в Нетскейпе

всех элементов

возможность прокрутки фонового изображения

background-attachment:fixed

background-position

 

[1] процент от ширины + процент от высоты (+)
[2] top, middle, bottom - одно из значений
[3] left, center, right - одно из начений
[4] расстояние от левого края + расстояние от вершины

block-level и replaced элементов

положение фонового изображения (работает с background-repeat равным repeat-x, repeat-y или no-repeat)

background-position:50%0%

background

 

[1] background-color
[2] background-image
[3] backgroun-position
[4] background-attachment
[5] background-repeat

всех элементов

обобщает вышеперечисленные свойства

background:no-repeat black fixed 50%0%

Параметры

Возможные значения:

Применимо для

Описание

Примеры

Свойства Box

margin-top

[1] длина (+)
[2] процент (+)
[3] auto – автоматически

всех элементов

определяет отступ сверху

margin-top:100

margin-right

[1] длина (+)
[2] процент (+)
[3] auto – автоматически

всех элементов

определяет отступ справа

margin-right:100%

margin-bottom

[1] длина (+)
[2] процент (+)
[3] auto – автоматически

всех элементов

определяет отступ снизу

margin-bottom:100em

margin-left

[1] длина (+)
[2] процент (+)
[3] auto – автоматически

всех элементов

определяет отступ слева

margin-left:100pt

margin

 

[1] margin-top
[2] margin-right
[3] margin-left
[4] margin-bottom

всех элементов

обобщает все вышеперечисленные свойства

 

padding

[1] padding-top
[2] padding-right
[3] padding-left
[4] padding-bottom

[1] длина (+)
[2] процент (+)

всех элементов

отступ от верхнего border'а

отступ от правого border'а

отступ от левого border'а

отступ от нижнего border'а

padding-top:100pt

padding-right:100%

padding-left:100

padding-bottom:100em

border-width

[1] border-top-width
[2] border-right-width
[3] border-left-width
[4] border-bottom-width

[1] длина (+)
[2] thin, medium
или thick

всех элементов

толщина верхнего border'а

толщина правого border'а

толщина левого border'а

толщина нижнего border'а

border-top-width:100pt

border-right-width:thick

border-left-width:medium

border-bottom-width:100em

border-color

[1] цвет (+)

всех элементов

Цвет border'а. Не работает в Нетскейпе

border-color:green

border-style

[1] none
[2]
dotted - пунктирняя линия кружочками,

dashed - пунктирняя линия прямоугольниками,

solid - сплошная со срезанными углами,

double - двойная линия,

groove - затемненная,

ridge – двухцветная,

inset - двухцветная с затемнением снаружи,

outset - двухцветная с затемнениея снутри              

всех элементов

стиль border'ов. Можно задать несколько значений одновременно для разных border'ов. Если установлено одно значение - задается единый стиль для всех сторон, если два - то задаются различные стили для прилежащих сторон и т.д.

border-style: dotted groove

border

[1] border-width
[2] border-style
[3] border-color

всех элементов

обобщает вышеперечисленные свойства

border: thik black double

width

[1] длина (+)
[2] процент (+)

block-level и replaced элементов

ширина элемента

width:10%

height

[1] длина (+)
[2] процент (+)

block-level и replaced элементов

высота элемента

height:100pt

Параметры

Возможные значения:

Применимо для

Описание

Примеры

float

[1] left – слева
[2] right - справа
[3] none – по умолчанию

всех элементов

расположение элемента

float:right

clear

[1] left – слева
[2] right - справа
[3] both - c двух сторон
[4] none - по умолчанию

всех элементов

расположение других элементов вокруг данного

clear:both

Классификация

display

[1] none - не отображается
[2] block - разбивает строку до и после элемента (т.е. элемент не может находится на одной линии с другими элементами)
[3] inline - не разбивает строку
[4] list-item - разбивает линию строку до и после элемента + добавляет маркер как у list-item элементов

всех элементов

определяет, как будет отображаться элемент

display:none

list-style-type

[1] disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha или upper-alpha
[2] none -
никакой

элементов со значением display равным list-item

определяет вид list-item маркера. Если значение list-style-image равно none или не уточнено

list-style-type:lower-alpha

list-style-image

[1] none - нет
[2] URL (+)

элементов со значением display равным list-item

задает вид list-item маркера в виде картинки

list-style-image:URL(cool.gif)

list-style-position

[1] inside - при переносе следующие строки будут отображаться без отступа
[2] outside - по умолчанию

элементов со значением display равным list-item

определяет положение маркера в зависимости от list item элемента

list-style-position:inside

list-style

[1] list-style-type
[2] list-style-position
[3] list-style-image

элементов со значением display равным list-item

обобщает вышеперечисленные свойства

list-style:inside

Автор: Вероника Зинченко
Источник: www.webstudy.land.ru

Ссылки по теме
Основы CSS
Справочник свойств CSS1
Введение в CSS
Практическое освоение CSS
 

 
Интересное в сети
 
10 новых программ
CodeLobster PHP Edition 3.7.2
WinToFlash 0.7.0008
Free Video to Flash Converter 4.7.24
Total Commander v7.55
aTunes 2.0.1
Process Explorer v12.04
Backup42 v3.0
Predator 2.0.1
FastStone Image Viewer 4.1
Process Lasso 3.70.4
FastStone Image Viewer 4.0
Xion Audio Player 1.0.125
Notepad GNU v.2.2.8.7.7
K-Lite Codec Pack 5.3.0 Full


Наши сервисы
Рассылка новостей. Подпишитесь на рассылку сейчас и вы всегда будете в курсе последних событий в мире информационных технологий.
Новостные информеры. Поставьте наши информеры к себе и у вас на сайте появится дополнительный постоянно обновляемый раздел.
Добавление статей. Если вы являетесь автором статьи или обзора на тему ИТ присылайте материал нам, мы с удовольствием опубликуем его у себя на сайте.
Реклама на сайте. Размещая рекламу у нас, вы получите новых посетителей, которые могут стать вашими клиентами.
 
Это интересно
 

Copyright © CompDoc.Ru
При цитировании и перепечатке ссылка на www.compdoc.ru обязательна. Карта сайта.