Полезное:
Как сделать разговор полезным и приятным
Как сделать объемную звезду своими руками
Как сделать то, что делать не хочется?
Как сделать погремушку
Как сделать так чтобы женщины сами знакомились с вами
Как сделать идею коммерческой
Как сделать хорошую растяжку ног?
Как сделать наш разум здоровым?
Как сделать, чтобы люди обманывали меньше
Вопрос 4. Как сделать так, чтобы вас уважали и ценили?
Как сделать лучше себе и другим людям
Как сделать свидание интересным?
Категории:
АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника
Способы применения CSS
|
|
Существует три способа применения таблиц стилей:
Внутренние таблицы стилей (Inline Style Sheets) - при помощи специального атрибута помещаются прямо в HTML теги.
Пример HTML:
<font color="blue" size="3" face="Arial"> Пример </font>Пример CSS:
<font style="color:blue; font-size:12pt; font-family:Arial"> Пример </font>
Как можно заметить, код Inline Style Sheet получился больше чем HTML. Поэтому ISS следует использовать, только если необходимо задать определенному элементу свой индивидуальный стиль.
При помощи дополнительного атрибута style мы можем определить нужные нам стилевые параметры в любом теге. Это самый легкий способ, и действует он в пределах лишь одноготега. Но представьте, насколько вырастет размер файла, и насколько неудобно будет его исправлять, если мы будем указывать стиль у каждого тега.
Глобальные таблицы стилей (Global Style Sheets) - определяют стиль элементов во всем документе.
Для этого используется тег <STYLE type="text/css">. Он размещается в заголовке документа <head>. Пример:
<html> <head>
<STYLE type="text/css">
h1 color:red; font-style:italic; font-size:32px - переопределение стандартного тега..blue color:blue - определение нового класса
</STYLE> </head> <body>
Теперь эти стили можно применять в любом месте html-кода. Для этого используются следующие конструкции:
<h1> Этот заголовок написан крупным красным курсивом </h1> Вот <font class="blue"> это </font> слово - синие.
</body> </html>
В данном примере все элементы H1 будут написаны крупным красным курсивом, все элементы с указанным классом BLUE будут синими.
Связанные таблицы стилей (Linked Style Sheets) - могут быть использованы для нескольких документов сразу и хранятся во внешнем файле. Самый мощный и удобный способ определения стилей и правил для сайта. Стили хранятся в отдельном файле, который может бытьиспользован для любых веб-страниц. Для подключения таблицы связанных стилей используетсятег <LINK> в заголовке страницы
Пример внешнего файла: Файл main.css
body background:black; font-size:9pt; color:red; font-family:Arial Black.basecolor:blue; font-style:italic
h1 color:white
#bold font-weight:bold
В самих же HTML документах делается ссылка на этот файл при помощи тега <LINK>. Выглядит это так:
<LINK rel="STYLESHEET" TYPE="text/css" HREF="путь до файла"> Пример:
Файл Index.html <html>
<head>
<LINK rel="stylesheet" type="text/css" href="main.css"> </head>
<body>
Содержание Документа </body>
</html>
Это самый удобный способ, и для основной таблицы стилей рекомендуется пользоваться именно им.
Date: 2015-12-12; view: 481; Нарушение авторских прав