Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) icon

Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм)




НазваниеСправочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм)
Дата конвертации04.07.2013
Размер155.05 Kb.
ТипСправочник
источник

Халелова Е.Н.

Справочник по CSS

Единицы измерения





    1. Типографские значения

pt — пункты (72 пункта на дюйм)

рс — пики (1 пика равна 12 пунктам)


    1. Экранные значения

рх — пиксели — элемент экрана, размер которого зависит от установок монитора и видеокарты.


    1. Абсолютные значения длины

in — дюймы

cm — сантиметры

mm — миллиметры


    1. Шрифт

Первая колонка таблицы содержит название свойства CSS, а также (выделено) название соответствующего свойства объекта style.

Пусть, например, в HTML-коде задан такой элемент:


=block style=" font-size: small ">

Огромный шар, надутый паром,


Поднялся в воздух он недаром,


Наш коротышка хоть не птица,


Летать он все-таки годится.


И все доступно уж, эхмa!


Теперь для нашего ума!<ВR>



Если в процессе интерактивного взаимодействия страницы с пользователем необходимо изменить размер шриф­та элемента block, то это достигается следующими строками на JavaScript:

var block=document . all [ "block " ] . style;

block. fontSize = "large";

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

Свойство

Описание

font-family


fontFamily

Значения:


название семейства шрифта (например, "New York") или родовое название (serif, sans-serif, monospace, cursive, fantasy).

По умолчанию: устанавливается браузером.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

Можно установить несколько возможных значений в порядке предпочтения (на случай, когда у пользователя не окажется нужного шрифта). Значения-указания разделяются

запятыми:

font- family: "Arial Cyr" , Geneva, Helvetica, sans-serif.





Свойство

Описание

font-size


fontSize

Значения:


<абсолютный> — xx-small, x-small, small, medium, large, x-large, xx-large;

<относительный> — larger, smaller;

<длина> — в любых допустимых единицах измерения;

<процент> — значения представлены в процентах от родительского размера шрифта.

По умолчанию: medium.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: да.

font-style


fontstyle

Значения:


normal, italic,oblique.

По умолчанию: normal.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

font-variant


fontVariant

Значения:


normal,small-caps.

По умолчанию: normal.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

font-weight


fontWeight

Значения:


normal, bold, bolder, lighter или число от 100 до 900.

По умолчанию: normal.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

Если используется числовое значение, то оно должно быть кратным 100.

Значение 400 — это то же, что normal, 700 — то же, что и bold.

Font


font


Значения:


/ .

По умолчанию: не определено.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: только для и .

^ Это свойство позволяет установить сразу несколько характеристик шрифта.

Разделитель значений — пробел. Порядок значений важен, но любое значение может быть опущено, кроме и
:

font: bold 12pt/14pt sans-serif.




    1. Цвет и фон




Свойство

Описание

color

color


background

background


Значения:


название цвета или его номер.

По умолчанию: зависит от браузера.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

Цвет может быть задан названием (например, blue) или номером по шкале RGB в шестнадцатеричной системе, например, #ff f f f f.


Значения:

transparent — отсутствие фона;

<цвет> — название цвета или его номер;

<ссылка> - картинка с заданным адресом.

Адрес заключается в скобки и идет непосредственно за ключевым словом url:


^ BODY {background: url (fonl.gif) }. Можно использовать и цвет, и картинку. Картинка будет лежать поверх цветного фона;

<повтор> — repeat (по умолчанию), repeat-x, repeat-y, no-repeat;

<скролл> — fixed, scroll.

Определяет, будет ли фоновая картинка оставаться на месте или прокручиваться вместе со страницей;

<позиция> — определяет расположение картинки на странице. •Значения могут быть процентными, абсолютными или ключевыми словами:

top, middle, bottom, left, center, right;

По умолчанию: transparent.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: да, относительно размера самого элемента. Порядок следования указаний не важен, разделитель — пробел: background: #COCOCO right
no-repeat url (../pic/explorer.gif).


background-attachment backgroundAttachment


Значения:


fixed, scroll.

По умолчанию: scroll.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет, будет ли фоновая картинка занимать фиксированное положение или прокручиваться вместе с содержимым.



background-color backgroundColor


Значения:


transparent, <цвет>.

По умолчанию: transparent.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет цвет фона элемента.

Цвет может быть задан названием (например, blue) или номером по шкале RGB в шестнадцатеричной системе, например, ffffff.


background-image backgroundlmage


Значения:


nоnе, <ссылка>.

По умолчанию: nоnе.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет фоновую картинку.

Синтаксис записи ссылки:

BODY {background-image: url (fonl.gif) }.


background-position backgroundPosition


Значения:


<попщия>, top, center, bottom, reft, right.

По умолчанию: top, left.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

Определяет начальное положение фоновой картинки (или фоновой заливки) с помощью двух значений (сначала по горизонтали, потом по вертикали) или при помощи двух ключевых слов.


background-repeat backgroundRepeat


Значения:


repeat, repeat-x, repeat-y, no-repeat.

По умолчанию: repeat.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет, повторяется ли фоновая картинка.

Если используются repeat-x или repeat-y, то картинка повторяется лишь вдоль одного направления.





    1. Текст




Свойство

Описание

letter-spacing

letterSpacing


Значения:

normal, <расстояние>.

По умолчанию: normal.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

^ Определяет добавочное расстояние между буквами.


line-height

lineHeight


Значения:

normal, <число>, <расстояние>, <процент>.

По умолчанию: зависит от браузера.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: да, по отношению к размеру шрифта элемента.

^ Определяет высоту текущей строки. Значение <число> интерпретируется как размер шрифта текущего элемента, умноженный на соответствующее число (например, 1,2).

Если используется <расстояние>, должны применяться единицы измерения.

Процентное отношение используется в сравнении с текущим размером шрифта и должно быть больше 100%.


text-align

textAlign


Значения:

left, right, center, justify.

По умолчанию: зависит от браузера.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

^ Определяет, как текст будет выровнен относительно содержащего его элемента.


text-decoration textDecoration


Значения:

none, overline, underline, line-through.

По умолчанию: none.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Линия вдоль строки (над, под, через).


text-indent

textIndent


Значения:

< величина>, < процент>.

По умолчанию: 0.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: да, относительно ширины родительского элемента.

^ Устанавливает величину отступа первой строки элемента (красной строки) в единицах измерения или как процент от ширины родительского элемента.


text-transform textTransform


Значения:

capitalize — делает заглавной первую букву каждого слова;

uppercase — делает все буквы в словах заглавными;

lowercase — делает все буквы в словах строчными.

По умолчанию: nоnе.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.


vertical-align

verticalAlign


Значения:

baseline — выравнивание по образцу родительского элемента;

sub — выравнивает элемент под базовой линией;

super — выравнивает элемент над базовой линией;

top — выравнивает верх элемента по верху самого высокого элемента текущей строки;

text-top - - выравнивает элемент по верху текста, набранного шрифтом родительского элемента;

middle - - устанавливает вертикальную среднюю линию элемента на основе родительского элемента плюс половина строки последнего;

bottom — выравнивает по низу самого низкого элемента текущей строки;

text-bottom - - выравнивает элемент по низу текста, набранного шрифтом родительского элемента.

По умолчанию: baseline.

Поддерживается: встроенными элементами.

Наследование: нет.

Процентная запись: да, по отношению к высоте строки.


list-style-image liststyleImage


Значения:

nоnе, < ссылка>.

По умолчанию: nоnе.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

^ Определяет адрес картинки, используемой в качестве маркера для каждого элемента списка.


list-style-type

liststyleType


Значения:

none, circle, disc, square, decimal, lower-alpha,

upper-alpha, lower-roman, upper-roman. .

По умолчанию: disc.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

^ Определяет вид маркера списка.


list-style-position liststylePosition


Значения:

outside, inside.

По умолчанию: outside.

Поддерживается: всеми элементами.

Наследование: да.

Процентная запись: нет.

^ Указывает, внутри или вне "тела" списка должен находиться маркер.





    1. Поля и рамки




Свойство

Описание

border-color

border-top-color

border-bottom-color

border-right-color

border-left-color

borderColor

borderTopColor

borderBottomColor

borderRightColor

borderLeftColor


Значения:

<цвет>.

По умолчанию: <нет цвета>.

Поддерживается: блоками элементов и замещающими элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет цвет четырех сторон рамки.

Свойство работает, если задано свойство border-style.


border-style

border-top-style

border-bottom-style

border-right-style

border-left-style

borderStyle

borderTopStyle

borderBottomStyle

borderRightStyle

borderLeftStyle


Значения:


none, solid, double, groove, ridge, inset, outset.

По умолчанию: none.

Определяет стиль четырех сторон рамки.

Поддерживается: блоками элементов и замещающими элементами.


border-width

border-top-width

border-bottom-width

border-right-width

border-left-width

borderWidth

borderTopWidth

borderBottomWidth

borderRightWidth

borderLeftWidth


Значения:


thin, medium, thick, <размер>.

По умолчанию: medium.

Поддерживается: блоками элементов и замещающими элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет ширину четырех сторон рамки.


border

border-top

border-bottom

border-right

border-left

border

borderTop

borderBottom

borderRight

borderLeft


Значения:


<ширина> <стиль> <цвет>.

По умолчанию: medium none <нет цвета>.

Поддерживается: блоками элементов и замещающими элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет свойства четырех сторон рамки.

Объединяет все другие свойства рамки.



margin

margin-top

margin-bottom

margin-right

margin-left

margin

marginTop

marginBottom

marginRight

marginLeft


Значения:


auto, <ширина>, <процент>.

По умолчанию: 0.

Поддерживается: блоками элементов и замещающими элементами.

Наследование: нет.

Процентная запись: да, относительно ширины родительского элемента.

^ Определяет размеры отступов данного элемента.


padding

padding-top

padding-bottom

padding-right

padding-left

padding

paddingTop

paddingBottom

paddingRight

paddingLeft


Значения:

< ширина>, < процент>.

По умолчанию: 0.

Поддерживается: блоками элементов и замещающими элементами.

Наследование: нет.

Процентная запись: да, относительно ширины родительского элемента.

Определяет расстояние между содержимым и рамкой элемента.


display

display


Значения:

"", none.

По умолчанию: " ".

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Это свойство определяет, будет ли показан элемент. Если элемент не виден (попе ), то место на странице под него не отводится.


float

styleFloat


Значения:


none, left, right.

По умолчанию: nоnе.

Поддерживается: DIV, SPAN и замещаемыми элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет обтекание элемента другими элементами (под, слева или справа).


clear

clear


Значения:


none, both, left, right.

По умолчанию: none.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Указывает, что следующие элементы должны быть показаны ниже элемента, выровненного по левому или правому краю.

По умолчанию текст "обтекает" такие элементы.


overflow

overflow


Значения:

"", scroll.

По умолчанию: " ".

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Значение scroll указывает, что если содержимое элемента выйдет за его границы, то оно будет прокручиваться.


visibility

visibility


Значения:

"", visible, hidden, inherit. По умолчанию: inherit. Поддерживается: всеми элементами. Наследование: нет. Процентная запись: нет.

Позволяет элементу быть видимым или невидимым на странице. Невидимые (hidden) элементы -занимают то же место и так же влияют на расположение других элементов, как и видимые (visible), но становятся прозрачными. Значение inherit означает, что элемент виден, если его родительский элемент является видимым.


width

width

pixelWidth

posWidth


Значения:

auto, <ширина>, <процент>.

По умолчанию: auto.

Поддерживается: DIV, SPAN и замещаемыми элементами. Наследование: нет.

Процентная запись: да, относительно ширины родительского элемента.

Устанавливает ширину элемента. Значение возвращается как строка, включающая тип единицы измерения (рх, % и т.д.). Для получения значения в виде числа используется свойство posWidth объекта style.


height

height

pixelHeight

posHeight


Значения:

auto, <высота>.

По умолчанию: auto.

Поддерживается: DIV, SPAN и замещаемыми элементами.

Наследование: нет.

Процентная запись: нет.

Устанавливает высоту элемента. Значение возвращается как строка, включающая тип единицы измерения (рх, cm и т.д.). Для получения значения в виде числа используется свойство posHeight объекта style.





    1. Позиционирование z-index




Свойство

Описание

positon

positon


Значения:

absolute, relative, static.

По умолчанию: static.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Свойство position объекта style доступно только для чтения.


left

left

pixelLeft

posLeft


Значения:

auto, <координата>, <процент>.

По умолчанию: auto.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: да, относительно ширины родительского элемента.

Устанавливает горизонтальную координату элемента. Значение возвращается как строка, включающая тип единицы измерения (рх, % и т.д.). Для получения значения в виде числа используется свойство posLeft объекта style.


top

top

pixelTop

posTop


Значения:

auto, <координата>, <процент>.

По умолчанию: auto.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: да, относительно ширины родительского элемента.

Устанавливает вертикальную координату элемента. Значение возвращается как строка, включающая тип единицы измерения (рх, % и т.д.). Для получения значения в виде числа используется свойство posTop объекта style.


z-index

zIndex


Значения:

<число>.

По умолчанию: в зависимости от контекста в исходном тексте HTML.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Указывает, в каком порядке элементы будут перекрывать друг друга.

Элементы с более высоким z-индексом будут располагаться сверху элементов с более низким. Положительные значения ставят элемент перед обычным текстом, отрицательные — ниже его.





    1. Курсор




Свойство

Описание

cursor

cursor


Значения:

auto, crosshair, default, hand, move, e-resize, ne-resize, nw-resize,

n-resize, se-resize, sw-resize, w-resize, text, wait, help.

По умолчанию: auto.

Поддерживается: всеми элементами.

Наследование: нет.

Процентная запись: нет.

^ Определяет вид курсора мыши.





  1. Теги
    и


Эти теги играют особую роль для CSS. Они позволяют выделять в документе отдельные области, задавая для них специфические свойства. Все, что нужно сделать для этого, - это поместить теги, принадлежащие конструируемой области, внутрь
или .

Разница между DIV и SPAN только в одном: после блока DIV браузер переходит на новую строку, а после блока SPAN – нет. Использование тега SPAN позволяет задавать стилевые свойства даже отдельным словам и буквам.







Похожие:

Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconСамостоятельная работа №2 Тема: «css и формы»
Назовите атрибут и его значения, с помощью которого можно задать позиционирование элементов в css?
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconСодержание Глава №1. Единицы измерения
Таблицы единиц измерения
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconУрок информатики в 10 классе Тема: " Измерение информации (алфавитный подход). Единицы измерения информации "
Обобщение материала по теме “Измерение информации (алфавитный подход). Единицы измерения информации”
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconТема: Количество информации. Единицы измерения информации. Цель
Цель: Ввести понятие количества информации, как меры уменьшения неопределенности, дать определение единице измерения информации;...
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconТематическое планирование математика 5 класс
Знать: основные понятия, способы обозначения простейших геометрических фигур, единицы измерения
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconПрактическая работа
Дайте команду Рисунок – Атрибуты и в диалоговом окне Атрибуты выберите единицы измерения (см) и задайте ширину и высоту 1 области...
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconКонспект урока по технологии «Деятельностный подход в обучении». Учитель: Воротникова А. А. 7 А класс
Тема: «Давление. Единицы измерения давления. Способы уменьшения и увеличения давления»
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconЛабораторная работа №4 Тема «Дизайн Web-страниц c помощью css»
Свойства css могут применяться к таблицам, их строкам и ячейкам для задания свойств текста и шрифта, управления фоном, полями, границами,...
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) iconРеферат на тему: «Старые русские меры»
В дореволюционных книгах часто встречаются такие единицы длины, как версты, сажени, аршины, футы. В торговле тогда применяли пуды,...
Справочник по css единицы измерения Типографские значения pt пункты (72 пункта на дюйм) icon1. Печатные пособия
Амперметр лабораторный с пределом измерения 2А для измерения в цепях постоянного тока
Разместите кнопку на своём сайте:
Документы


База данных защищена авторским правом ©vmeste.opredelim.com 2000-2017
При копировании материала обязательно указание активной ссылки открытой для индексации.
обратиться к администрации
Документы