[table]В этом уроке мы рассмотрим основы CSS и посмотрим, как это все выглядит на практике. Если же вы еще не знаете для чего нужны CSS и зачем их применяют при создании сайтов, то я рекомендую вам ознакомиться с уроком Что такое CSS. [/table] [table]Раз уж Вы решили изучить основы CSS то вам уже наверняка известно, что HTML состоит из тегов, каждый из тегов по умолчанию, отображает свое содержимое (то что заключено между тегами) определенным образом, т. е. он имеет какой-то свой стиль оформления. При помощи CSS мы можем поменять этот стиль и придать тому или иному объекту такой вид, который нам необходим. [/table] [table]Описание стилей различных элементов заключается между тегами <STYLE></STYLE>. Сам способ записи в CSS не такой как запись тегов в HTML. Присвоение свойств какому либо элементу делается при помощи следующей записи: [/table] [table]селектор { свойство: значение; } -где селектор это тег, класс или идентификатор, которому мы хотим присвоить определенные свойства, свойство это свойство данного тега которое мы хотим изменить, а значение это значение которое мы хоти присвоить данному свойству. [/table] [table]Свойство и значение записывается в фигурных скобках, после свойства идет двоеточие, а после значения точка с запятой. Во всем остальном CSS не чувствителен к регистру, переносу строк, пробелам, т. е. саму запись вы можете осуществлять, как вам будет удобно. [/table] [table]Ниже приведен пример, чтобы Вы могли видеть, как это работает на практике. В данном примере с помощью CSS задан цвет текста. Создайте из этого кода HTML страницу. Для этого скопируйте данный код, вставьте его в текстовый редактор “Блокнот”, а затем пройдите в пункт меню "Файл" >> "Сохранить как...", и сохраните этот файл с расширением .html После этого откройте сохраненный файл при помощи вашего браузера и Вы увидите, что текст имеет синий цвет. [/table]
Code
<html> <head> <title>Моя первая страница с использованием CSS</title> <STYLE >p {color:#330099;}</STYLE> </head> <body> <p>Пример использования CSS при оформлении текста</p> </body> </html>
[table]Обратите внимание, что описание стилей в html коде располагаются между тегами <head></head>, а тег p которому присваивается свойство пишется без угловых скобок. Кроме этого мы можем расширить свойства нашего тега p и задать нашему тексту не только цвет, но и размер и фон и т. д. [/table] [table]Добавьте свойства, которые имеются в коде расположенном ниже (или просто замените старый код на код расположенный ниже) и посмотрите, что получится с вашим текстом. [/table]
Code
<html> <head> <title>Моя первая страница с использованием CSS </title> <STYLE >p {color:#330099;background-color:#FFFF99;font:14px Verdana, Arial, Helvetica, sans-serif;}</STYLE> </head> <body> <p>Пример использования CSS при оформлении текста</p> </body> </html>
ICQ: 598656089
Steam: Нет данных
Skype: freekiller_nad
