Примеры использования стилей (
CSS ). Выравнивание текста, гиперссылки.
Я постараюсь простым и доступным языком, объяснит те моменты, которые
Вам смогут пригодиться.
Использование стилей может существенно уменьшить вес Вашего сайта!
За счет чего это происходит? Постараюсь объяснить на конкретных примерах.
Выравнивание текста и гиперссылки.
Заранее зададим некоторым тегам необходимые нам параметры и разместим
ниже приведенный код между <head> и </head>
<style type="text/css">
<-!
a { font-family:
Arial, Helvetica, sans-serif; color:
#999999; font-size: 9pt; text-decoration:
none}
a:hover { font-family:
Arial, Helvetica, sans-serif; color:
#0000FF; font-size: 9pt; text-decoration:
underline}
p { font-family:
Arial, Helvetica, sans-serif; color:
#000000; font-size: 9pt; text-align:
justify}
->
</style>
А теперь посмотрим, что нам это даст
a - присваивает тегу <a> значения
которые будут использоваться по умолчанию.
a:hover - этот параметр начинает работать
когда мы на ссылку нацеливаемся мышкой.
Пример -> ссылка
Разберемся поподробней, что к чему.
font-family: Arial, Helvetica, sans-serif
- выбираем шрифт.
Сначала проверяется наличие на удаленном компьютере шрифта "Arial",
если такого нет используется "Helvetica",
а если и этот шрифт не найден подставляется тот, который используется
по умолчанию на удаленном компьютере "sans-serif".
color: #999999 - задаем параметры цвета
font-size: 9pt - размер шрифта
text-decoration: none - говорим ссылке не использовать подчеркивание
text-decoration: underline - ссылка на которую мы наведем мышкой,
будет подчеркнутой :)
text-align: justify - это значение у нас стоит в строке, где мы задаем
параметры тегу <p> p, сие
действие будет выравнивать весь текст расположенный между <p>
и </p>.
Данные настройки распространяются на всю
страницу!
Этот пример не отражает
всех возможностей использования стилей. Потому, как практически любому
тегу могут быть заданы любые параметры.
Используемые стили можно выносить в отдельный файл и использовать
только к определенным Вами фрагментам.
P.S. - добавление более подробной информации, зависит только
от Вас! Если у Вас есть вопросы, спрашивайте. Просто не хочется заваливать
сайт, никому не нужной информацией...
НА ГЛАВНУЮ
