Что такое css.

Опубликовано:
Просмотров: 2465
+3
Голосов: 3

Итак попробуем начать про css.

Для сайтов на InstantCMS основным файлом для определения стиля сайта является styles.css. Он расположен в папке css шаблона сайта. Он отвечает за вид вывода модулей сайта.

Кроме styles.css за вид отвечают файлы mod.name.tpl, но сейчас мы попробуем разобрать структуру вывода модулей.

Итак в папке css идет файл styles.css, который отвечает за вывод каждого модуля и позиций модулей на сайте в виде графического оформления. Также в папке css имеются еще файлы стилей, это text.css который отвечает за вывод текста сайта, reset.css - CSS сбрасывающий настройки браузеров по умолчанию и некоторые другие.

Styles.css обычно имеет очень много строк кода, но работать с ним нетрудно, если знать основные принципы.

Для начала вы ставите один из двух браузеров, это либо Мозилла, к нему надо поставить Firebug, либо Хром, в котором уже есть функция смотреть css.

Итак в Хроме наводим на нужный вам элемент и нажимаем "Просмотр кода элемента", получаем вот такой вид

Это общее представление, что вы должны увидеть. На рисунке, вы видите, что внизу браузера появляется слева выбор элементов сайта, справа код стиля, который отвечает за его вывод на экране браузеров.

Это начальное представление, продолжение следует.

Комментарии (2)
Gorec #
Рейтинг: 0
#logo{
width:340px;
height:100px;
float:left;
display: block;
padding:15px 10px 5px;
}

#logo a{
width:420px;
height:100px;
display: block;
cursor: pointer;
outline:0px;
text-decoration: none;

}

#top_banner_box{
clear: both;
position: relative;
z-index:0;
overflow: hidden;
width: 425px;
height:150px;
margin: 0px;
padding:15px 10px 5px;
}

#top_banner_box div.simple{
float: left;
margin:0px 15px 10px 0px;
}
Кто нибудь знает чем первые от вторых отличаются?
Маня #
Рейтинг: 0
#logo{ стиль для logo width:340px; ширина 340 пикселей height:100px; высота 100 пикселей float:left; налево display: block; в прямоугольной области можно здесь ширину и высоту padding:15px 10px 5px; отступы от края } и т.д.

Голосуем

Самый нужный компонент