Иллюстрированный самоучитель по Adobe Golive
Применение стилей - часть 6
<p id="pl" onMouseover="chan_style()">Пример обычной строки текста</р>
</body>
</html>
Рис. 7.5. Окно браузера с результатом отображения файла, приведенного в листинге 7.5, в тот момент, когда пользователь навел курсор мыши на текстовую строку
Механизм подключения скрипта к единственному абзацу, расположенному на нашей демонстрационной Web-странице, уже должен быть вполне понятен. Единственное место в данном HTML-документе, которое следует несколько внимательнее рассмотреть — это тело функции, обрабатывающей событие onMouseover. В ее коде видно, что мы воспользовались объектом style, а точнее, его несколькими свойствами. По аналогии с технологией CSS легко догадаться, что свойство backgroundcoior устанавливает цвет фона, а свойство color — цвет шрифта. Однако хотелось бы точно знать, какими свойствами обладает объект style, и какие параметры CSS они дублируют. В табл. 7.8 перечислены все свойства объекта style.
Таблица 7.8. Свойства объекта style
| Наименование свойства | Описание свойства |
| background | Задает URL графического изображения, использующегося в качестве фона для элемента |
| backgroundAttachment | Определяет механизм прокручивания фонового изображения вместе с содержимым элемента |
| backgroundColor | Задает цвет фона |
| background Image | Содержит URL графического изображения, используемого в качестве фона |
| backgroundPosition | Определяет координаты левого верхнего угла фонового изображения |
| backgoundPositionX | Устанавливает горизонтальную координату верхнего левого угла фонового рисунка |
| backgoundPositionY | Устанавливает вертикальную координату верхнего левого угла фонового рисунка |
| backgroundRepeat | Задает механизм повторения фонового изображения на пространстве, занимаемом элементом, если это пространство больше по размерам, чем применяемое графическое изображение |
| border | Задает стиль отображения границы вокруг элемента |
| borderBottom | Определяет параметры отображения нижней границы элемента |
| borderBottomColor | Задает цвет нижней границы элемента |
| borderBottomStyle | Задает стиль линии нижней границы элемента |
| borderBottomWidth | Устанавливает ширину нижней границы элемента |
| borderColor | Задает цвет границы элемента |
| BorderLeft | Определяет параметры отображения левой границы элемента |
| border LeftColor | Задает цвет левой границы элемента |
| borderLeftStyle | Задает стиль линии левой границы элемента |
| borderLeftWidth | Устанавливает ширину левой границы элемента |
| borderRight | Определяет параметры отображения правой границы элемента |
| border Right Color | Задает цвет правой границы элемента |
| borderRight Style | Задает стиль линии правой границы элемента |
| borderRightWidth | Устанавливает ширину правой границы элемента |
| borderStyle | Указывает стиль линий границы элемента |
| borderTop | Определяет параметры отображения верхней границы элемента |
| borderTopColor | Задает цвет верхней границы элемента |
| borderTopStyle | Задает стиль линии верхней границы элемента |
| borderTopWidth | Устанавливает ширину верхней границы элемента |
| borderWidth | Указывает ширину границы элемента |
| clear | Указывает порядок позиционирования и выравнивания содержимого элемента |
| clip | Задает порядок отображения содержимого элемента, если оно по размерам превосходит пространство, отведенное элементу в окне просмотра браузера |
| color | Задает цвет элемента |
| cssText | Содержит текстовое значение атрибута style, внедренного в тег |
| cursor | Задает тип курсора мыши, который будет отображаться в то время, когда он будет находиться над элементом |
| display | Определяет, будет или нет отображаться данный элемент в окне просмотра браузера |
| filter | Указывает на набор всех графических фильтров, которые применялись к данному элементу |
| font | Задает свойства шрифта, которым будет отображаться текстовое содержимое элемента |
| font Family | Устанавливает шрифт, которым будет отображаться текст |
| fontSize | Задает размер используемого шрифта |
| fontStyle | Указывает начертание применяемого шрифта |
| fontVariant | Задает способ отображения строчных символов |
| fontWeight | Устанваливает ширину линий, которыми отображаются символы шрифта |
| height | Задает высоту элемента |
| left | Устанавливает горизонтальную координату верхнего девого угла элемента |
| letterSpacing | Задает межсимвольное расстояние |
| lineHeight | Устанавливает межстрочный интервал |
| listStyle | Указывает способ отображения элементов списка |
| listStylelmage | Задает графическое изображение для создания маркера |
| listStyle Position | Устанавливает расположение маркеров элементов списка |
| listStyleType | Указывает, какой тип стандартных маркеров будет использоваться в данном элементе |
| margin | Определяет внешний вид полей элемента |
| marginBottom | Задает размеры нижнего поля элемента |
| MarginLeft | Задает размеры левого поля элемента |
| MarginRight | Задает размеры правого поля элемента |
| marginTop | Задает размеры вержнего поля элемента |
| overflow | Определяет правило отображения содержимого элемента, переполняющего выделенное для него пространство |
| paddingBottom | Определяет размер отступа между содержимым элемента и его нижней границей |
| paddingLeft | Определяет размер отступа между содержимым элемента и его левой границей |
| paddingRight | Определяет размер отступа между содержимым элемента и его правой границей |
| paddingTop | Определяет размер отступа между содержимым элемента и его верхней границей |
| pageBreakAfter | Устанавливает разрыв страницы перед элементом |
| pageBreakBefore | Устанавливает разрыв страницы после элемента |
| pixelHeight | Содержит численное значение высоты элемента в пикселах |
| pixelLeft | Содержит численное выражение горизонтальной координаты верхнего левого угла элемента в пикселах |
| pixelTop | Содержит численное выражение вертикальной координаты верхнего левого угла элемента в пикселах |
| pixelWidth | Содержит численное значение ширины элемента в пикселах |
| position | Определяет применяемую модедь позиционирования элемента |
| posLeft | Содержит числовое значение горизонтальной координаты левого верхнего угла элемента в единицах измерения, заданных в последнюю очередь |
| posTop | Содержит числовое значение вертикальной координаты левого верхнего угла элемента в единицах измерения, заданных в последнюю очередь |
| posWidth | Содержит числовое значение ширины элемента в единицах измерения, заданных в последнюю очередь |
| styleFloat | Задает стиль расположения содержимого элемента |
| textAlign % | Устанавливает выравнивание текстового содержимого элемента |
| text Decor at ion | Устанавливает способ отображения текста |
| textlndent | Устанавливает отступ первой строки абзаца |
| textTransform | Задает стиль отображения различных регистров шрифта |
| top | Содержит вертикальную координату верхенго левого угла элемента |
| verticalAlign | Задает вертикальное выравнивание элемента |
| visibility | Регулирует видимость данного элемента |
| width | Задает ширину элемента |
| zlndex | Устанавливает псевдовертикальное позиционирование элемента |
Руководствуясь этой таблицей, мы получаем доступ ко всем свойствам стилевого оформления для каждого элемента содержимого Web-страницы. Таким образом, при помощи технологии DHTML мы получаем контроль над свойствами отображения любого элемента Web-страницы.