Атрибуты style css в html. Внедрение CSS в HTML документ
В этой главе:
Атрибут style
Атрибут style - используется для стилизации элементов непосредственно в коде. Цель атрибута style заключается в предоставлении простого способа использования CSS стилей в любом HTML-элементе.
В этом самоучителе атрибут style показан для вашего общего представления об использовании CSS, как инструмента для стилизации страниц. Основы CSS вы cможете изучить с помощью нашего самоучителя по CSS.
Код примера познакомит вас с новым способом форматирования документа:
Этот текст написан красным цветов с помощью шрифта Verdana.
Этот текст написан зеленым цветом с помощью шрифта Times.
Этот текст имеет размер 30 пикселей.
Внимательно посмотрите на пример, с помощью атрибута style мы задаем CSS стиль внутри HTML-элементов, такой способ задания стилей называется встроенным стилем.
После демонстрации работы атрибута style предлагаем вам познакомится с самыми распространенными свойствами для стилизации текста
Задний фон
Выравнивание текста
Выравнивание текста в HTML документе задаётся с помощью свойства text-align , которое позволяет выравнять текст по правой или левой строне, а так же задать выравнивание текста по ширине. Свойство text-align работает только с блочными элементами, выравнивая все строчные элементы внутри блочного:
Заголовок
Очень маленький размер текста.
Этот текст будет выровнен по правому краю.
С помощью атрибута style можно задать стиль любого элемента XHTML:
Мы рождены, чтоб сказку сделать былью…
Для задания нескольких свойств одновременно их необходимо разделять точкой с запятой:
Элемент
Пример: Внутренняя таблица стилей
- Попробуй сам »
Заголовок
Текст первый
Текст второй
Текст третий
Заголовок
Текст первый
Текст второй
Текст третий
В данном примере мы с помощью CSS установили цвет фона для элемента
: background-color:palegreen , цвет и тип шрифта для заголовков: color: blue; font-family:verdana , а также размер шрифта, цвет и выравнивание текста по центру для параграфов
: font-size:20px; color:red; text-align:center .
Встроенный стиль
Когда необходимо отформатировать отдельный элемент HTML-страницы, описание стиля можно расположить непосредственно внутри открывающего тега при помощи уже специализированного атрибута style. Например:
Параграф
Такие стили называют встроенными (inline), или внедренными. Правила, определенные непосредственно внутри открывающего тега элемента перекрывают правила, определенные во внешнем файле CSS, а также правила, определенные в элементе
Заголовок
Текст первый
Текст второй
Текст третий