Главная
Блог разработчиков phpBB
 
+ 17 предустановленных модов
+ SEO-оптимизация форума
+ авторизация через соц. сети
+ защита от спама

Введение в CSS.

Viktor | 24.02.2014 | нет комментариев

Что такое CSS?

В уроках изученных ранее (по HTML) мы с Вами создали простой сайт посвященный автомобилям. При задании элементов оформления веб-страниц (текст, шрифт, рамка сайта и т.д.) каждому из элементов мы с Вами прописывали в коде свои теги предписывающие браузеру как он (браузер) будет отображать данную страницу на экране монитора. Этот учебный сайт содержал всего 6 страниц. А теперь представьте что на Вашем сайте страниц 50 или больше и вот Вам например понадобилось изменить цвет шрифта или рамку вокруг сайта….. Т.е. необходимо открыть все 50 файлов (или больше) и прописать для каждого абзаца другой цвет шрифта, это же сколько работы необходимо проделать причем работы очень бестолковой и рутинной.

Однако существует технология позволяющая управлять оформлением дизайна одновременно на всех страницах сайта одновременно изменением всего нескольких строк кода. Эта технология позволяет отделить дизайн сайта от его содержания. Этот так называемые каскадные таблицы стилей CSS.

CSS Cascading Style Sheets (Таблицы каскадных стилей) – это набор правил оформления и форматирования, который может быть применен к различным элементам страницы. В стандартном HTML для присвоения какому-либо элементу определенных свойств (таких, как цвет, размер, положение на странице и т. п.) приходиться каждый раз описывать эти свойства. Применяя CSS, Вы можете один раз описать свойства элементов и определить это описание как стиль, а в дальнейшем просто указывать, что элемент, который вы хотите оформить соответствующим образом, должен принять свойства стиля, описанного вами.

Вы можете сохранить описание стиля как в тексте самой веб-странички, так и в отдельном файле – это позволит использовать описание стиля на любом количестве Web-страниц. В этих уроках Мы будем с Вами говорить о написании стилевых правил в отдельном файле.

Данный файл, так же как и html страничка создается в стандартном блокноте или любом текстовом редакторе и сохраняется в корневой папке сайта обычно под именем style.css. Хотя назвать Вы его можете и по другому, но обращаю Ваше внимание на обязательное расширение .css.

Чтобы привязать данный файл стилей к конкретному html документу, в этом документе между тегами <head> </head> прописывается вот такой код:

 

<link rel=stylesheet type=”text/css” href=”style.css”>

HTML-документов, к которым привязывается данная таблица стилей, может быть бесчисленное множество. В местах html-страницы, где мы хотим применить данный стиль просто ставятся специальные метки при написании кода. Если таблица стилей лежит в кокай-либо папке, то необходимо вместо “style.css” прописать полный путь к этому файлу как мы делали для указания пути к графическим файлам. Но давайте пока не будем усложнять, пусть наш файл style.css лежит в корневой папке сайта.

Теперь Вы понимаете, чтобы изменить любой элемент оформления на всех станицах сайта, достаточно изменить код оформления данного элемента только в этой таблице стилей.

Итак приступим к оформлению дизайна нашего тестового сайта с помощью CSS каскадных таблиц стилей.

АВТОРСКИЕ ПРАВА
Источник: luksweb.ru
При перепечатке ссылка на источник обязательна
Оставить комментарий

Ваш email не будет опубликован. Обязательные поля помечены (обязательно)

Вы можете использовать это HTMLтеги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Форум phpBB, русская поддержка форума phpBB
Рейтинг@Mail.ru 2008 - 2014 © BB3x.ru - русская поддержка форума phpBB