Стили css не могу работать сами по себе, без страницы html. Первое, что мы сделаем, это создаем файл с расширением .css и пусть он для удобства будет находиться в одной папке с каким либо файлом .html.
Например, создали файлы index.html и файл style.css. Style.css как раз и будет содержать стили.
Как связать css с html?
В файле index.html, между тегами <head> </head> мы напишем следующее:
<link rel="stylesheet" type="text/css" href="style.css">
То есть, в html странице мы пишем примерно следующее:
<HTML> <head> <title>Моя страничка</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> Описание страницы Описание страницы Описание страницы...... </body> </HTML>
То есть мы привязали нашу страницу index.html к файлу стилей, который мы назвали style.css. Причем файл стилей должен лежать в одной папке с файлом html, к которому мы прописывали эту строчку.
Основы Css
Посмотрим, как вообще работают стили. Попробуем разобраться на примере параграфа - <P>. По идее, текст в html разделен на параграфы. Так вот, если в css файле мы напишем:
p {color:red;}
То весь текст, который в html страницах заключен в параграфы, станет красным цветом.
Запомните структуру: пишем сперва элемент, к которому хотим задать стили, в данном случае p, затем в кавычках {} пишем уже стили. Каждый новый стиль через точку с запятой.
Преимущества Css
Css удобно тем, что, при желании что-то изменить на своем сайте, Вам не надо будет изменять каждую страницу, а просто можно изменить некоторые атрибуты в css файле. И во всех страницах (при условии, что у них прописана строчка связи с css) произойдут изменения.
Возьмем наш пример с параграфом. Мы можем одним движением в файле css изменить текст во всех параграфах, которые есть на сайте.
На самом деле файл стилей можете называть как угодно, главное, чтобы он был с расширением .css. Например: mystyle.css ; stl.css, да и вообще как пожелаете.
