русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

Обзор CSS


Дата добавления: 2015-07-09; просмотров: 654; Нарушение авторских прав


 

Стили в CSS_таблицах задаются в виде разделенных точкой с запятой пар атри_ бутов, состоящих из имени и значения. Между собой имя и значение разделяют_ ся двоеточием. Например, следующий стиль определяет полужирный подчерк_ нутый текст синего цвета:

 

font_weight: bold; color: blue; text_decoration: underline;

 

Стандарт CSS описывает множество атрибутов стилей. В табл. 16.1 перечислены все атрибуты, кроме тех, которые в настоящее время практически не поддержива_ ются. Возможно, на данном этапе эти атрибуты и их значения покажутся вам не_ понятными. Однако когда вы больше узнаете о CSS_стилях и станете применять их в документах и сценариях, эта информация будет вам полезной в качестве справочника. Более полную документацию по CSS можно найти в выпущенных издательством O’Reilly книгах «Cascading Style Sheets: The Definitive Guide»1 Эрика Мейера (Eric Meyer) и «Dynamic HTML: The Definitive Guide» Денни Гуд_ мена (Danny Goodman). Можно также прочитать спецификацию по адресу http:// www.w3c.org/TR/CSS21/.

 

Во втором столбце табл. 16.1 показаны допустимые значения для каждого атри_ бута стиля. Здесь используется та же грамматика, что и в спецификации CSS. Слова, написанные моноширинным шрифтом, являются ключевыми и должны присут_ ствовать в документе в том же виде, в котором они приведены в таблице. Слова, выделенные курсивом, описывают тип данных, например string (строка) или length (длина). Обратите внимание, что тип length – это число, за которым следу_ет спецификация единицы измерения, например px (пикселы). Описания других типов можно найти в литературе по CSS. Слова, набранные моноширинным курсивом, определяют набор значений, допустимых для некоторого другого CSS_атрибута. Помимо значений, представленных в таблице, каждый атрибут стиля может иметь значение inherit, указывающее, что атрибут должен наследовать значе_ ние родительского элемента.



 

Значения, разделенные символом |, являются альтернативными – требуется указать только одно из них. Значения, разделенные символами ||, представля_ ют собой варианты – необходимо указать хотя бы одно из них, но можно указать и несколько (в любом порядке). Квадратные скобки [] предназначены для объе_ динения значений в группы. Звездочка * означает, что предыдущее значение или группа может присутствовать ноль или более раз, знак + говорит о том, что

1 Эрик Мейер «CSS – каскадные таблицы стилей. Подробное руководство», 3_е из_ дание. – Пер. с англ. – СПб.: Символ_Плюс, 2008.


 

362 Глава 16. CSS и DHTML

предыдущее значение или группа может присутствовать один или более раз, а вопросительный знак ? указывает, что предыдущее значение не обязательно и может присутствовать ноль или более раз. Число в фигурных скобках задает количество повторений. Например, {2} означает что предыдущее значение должно быть повторено дважды, а {1,4} – что предыдущее значение должно при_ сутствовать не менее одного раза и не более четырех раз. (Этот синтаксис повто_ рения может показаться вам знакомым, поскольку соответствует синтаксису ре_ гулярных JavaScript_выражений, описываемому в главе 11.)

 

Таблица 16.1. Атрибуты CSS'стилей и их значения

 

Имя Значение
   
background [ background_color || background_image || background_repeat ||
  background_attachment || background_position ]
background_attachment scroll | fixed
background_color color | transparent
background_image url (url) | none
background_position [[ percentage | length ]{1,2} | [[ top | center | bottom ] || [ left |
  center | right ]]]
background_repeat repeat | repeat_x | repeat_y | no_repeat
border [ border_width || border_style || color ]
border_collapse collapse | separate
border_color color{1,4} | transparent
border_spacing length length?
border_style [ none | hidden | dotted | dashed | solid | double | groove | ridge |
  inset | outset ]{1,4}
border_top [ border_top_width || border_style || [ color | transparent ]]
border_right  
border_bottom  
border_left  
border_top_color color | transparent
border_right_color  
border_bottom_color  
border_left_color  
border_top_style none | hidden | dotted | dashed | solid | double | groove | ridge | in_
border_right_style set | outset
border_bottom_style  
border_left_style  
border_top_width thin | medium | thick | length
border_right_width  
border_bottom_width  
border_left_width  
   

 

16.1. Обзор CSS  
       
Имя   Значение  
   
       
border_width   [ thin | medium | thick | length ]{1,4}  
bottom   length | percentage | auto  
caption_side   top | bottom  
clear   none | left | right | both  
clip   [ rect( [ length | auto ]{4} )] | auto  
color   color  
content   [ string | url(url) | counter | attr(attribute_name) | open_quote |  
    close_quote | no_open_quote | no_close_quote ]+ | normal  
counter_increment   [ identifier integer? ]+ | none  
counter_reset   [ identifier integer? ]+ | none  
cursor   [ [ url(url) ,]* [ auto | crosshair | default | pointer | progress |  
    move | e_resize | ne_resize | nw_resize | n_resize | se_resize | sw_  
    resize | s_resize | w_resize | text | wait | help ] ]  
direction   ltr | rtl  
display   inline | block | inline_block | list_item | run_in | table | inline_  
    table | table_row_group | table_header_group | table_footer_group |  
    table_row | table_column_group | table_column | table_cell | table_  
    caption | none  
empty_cells   show | hide  
float   left | right | none  
font   [ [ font_style || font_variant || font_weight ]? font_size [ / line_  
    height ]? font_family ] | caption | icon | menu | message_box | small_  
    caption | status_bar  
font_family   [[ family'name | serif | sans_serif | monospace | cursive | fantasy  
    ],]+  
font_size   xx_small | x_small | small | medium | large | x_large | xx_large |  
    smaller | larger | length | percentage  
font_style   normal | italic | oblique  
font_variant   normal | small_caps  
font_weight   normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700  
    | 800 | 900  
height   length | percentage | auto  
left   length | percentage | auto  
letter_spacing   normal | length  
line_height   normal | number | length | percentage  
list_style   [ list_style_type || list_style_position ||мlist_style_image ]  
list_style_image   url(url) | none  
       

 

  Глава 16. CSS и DHTML  
       
    Таблица 16.1 (продолжение)  
Имя   Значение  
   
       
list_style_position   inside | outside  
list_style_type   disc | circle | square | decimal | decimal_leading_zero | lowerroman |  
    upper_roman | lower_greek | lower_alpha | lower_latin | upper_alpha  
    | upper_latin | hebrew | armenian | georgian | cjkideographic | hira_  
    gana | katakana | hiragana_iroha | katakanairoha | none  
margin   [ length | percentage | auto ]{1,4}  
margin_top   length | percentage | auto  
margin_right      
margin_bottom      
margin_left      
marker_offset   length | auto  
max_height   length | percentage | none  
max_width   length | percentage | none  
min_height   length | percentage  
min_width   length | percentage  
outline   [ outline_color || outline_style || outline_width ]  
outline_color   color | invert  
outline_style   none | hidden | dotted | dashed | solid | double | groove | ridge | in_  
    set | outset  
outline_width   thin | medium | thick | length  
overflow   visible | hidden | scroll | auto  
padding   [length | percentage]{1,4}  
padding_top   length | percentage  
padding_right      
padding_bottom      
padding_left      
page_break_after   auto | always | avoid | left | right  
page_break_before   auto | always | avoid | left | right  
page_break_inside   avoid | auto  
position   static | relative | absolute | fixed  
quotes   [string string]+ | none  
right   length | percentage | auto  
table_layout   auto | fixed  
text_align   left | right | center | justify  
text_decoration   none | [ underline || overline || line_through || blink ]  
       

 

16.1. Обзор CSS  
       
Имя   Значение  
   
       
text_indent   length | percentage  
text_transform   capitalize | uppercase | lowercase | none  
top   length | percentage | auto  
unicode_bidi   normal | embed | bidi_override  
vertical_align   baseline | sub | super | top | text_top | middle | bottom | text_bottom  
    | percentage | length  
visibility   visible | hidden | collapse  
white_space   normal | pre | nowrap | pre_wrap | pre_line  
width   length | percentage | auto  
word_spacing   normal | length  
z_index   auto | integer  
       

 

Стандарт CSS позволяет объединять определенные атрибуты стилей, которые часто задаются вместе, с помощью специальных атрибутов_сокращений. Напри_ мер, атрибуты font_family, font_size, font_style и font_weight могут быть одновре_ менно установлены с помощью одного атрибута font:

 

font: bold italic 24pt helvetica;

 

Атрибуты margin и padding являются сокращениями атрибутов, задающих поля, отступы и границы отдельной стороны элемента. Поэтому вместо атрибута mar_ gin можно задать атрибуты margin_left, margin_right, margin_top и margin_bottom. То же самое относится к атрибуту padding.

 



<== предыдущая лекция | следующая лекция ==>
CSS и DHTML | Применение правил стиля к элементам документа


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.612 сек.