Rambler's Top100
Структуралист (на главную)  
 

Разработка стилей

Каскадные таблицы стилей, используемые на данном сайте, размещены в файле mainstyles.css:

.top {
background-color: #990000;
}
.left {
background-color: #FF9966;
padding-top: 10px;
font-family: "Times New Roman", Times, serif;
font-size: 18px;
list-style-type: circle;
margin-top: 10px;
border-right-width: 2px;
border-right-style: solid;
border-right-color: #990000;
}
.maintitle {
font-family: "Times New Roman", Times, serif;
color: #FF0000;
text-align: center;
filter: DropShadow(Color="black", OffX=3, OffY=2,
Positive="yes");
font-size: 42px;
}
body {
background-color: #FFFFCC;
}
.epigraph {
font-family: "Times New Roman", Times, serif;
font-size: 16px;
color: #660000;
font-style: italic;
}
.botton {
font-family: "Times New Roman", Times, serif;
font-size: 14px;
color: #660000;
border-top-width: 3px;
border-top-style: solid;
border-top-color: #990000;
}
.maintext {
font-size: 16px;
padding: 20px 20px 40px;
text-align: justify;
}
h1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
text-align: center;
}
h2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
}
.epigraphtext {
font-family: "Times New Roman", Times, serif;
font-style: italic;
padding-left: 100px;
}
a:link {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #660000;
}
a:visited {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #666666;
}
a:hover {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #FF0000;
}
a:active {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #FF3333;
}
.temp {
font-size: 18px;
color: #FFFFFF;
}
li {
font-size: 18px;
margin-top: 6px;
}
.right {
border-right-width: 2px;
border-right-style: solid;
border-right-color: #990000;
}
strong {
font-size: 16px;
font-style: italic;
font-weight: bold;
color: #333333;
}
.centering {
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
}
.towebmaster {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #990000;
}
liplus {
font-family: "Times New Roman", Times, serif;
font-size: 16px;
}
.liplus {
font-family: "Times New Roman", Times, serif;
font-size: 16px;
}
.totop {
font-size: 16px;
color: #336600;
text-align: right;
}

Комментарии:

Стиль:

.top {
background-color: #990000;
}

определяет отображение верхней части сайта, задавая цвет фона:

background-color: #990000;

Далее идет определение стиля левой части сайта, где расположена навигация:

.left {
background-color: #FF9966;
padding-top: 10px;
font-family: "Times New Roman", Times, serif;
font-size: 18px;
list-style-type: circle;
margin-top: 10px;
border-right-width: 2px;
border-right-style: solid;
border-right-color: #990000;

Таблица 6
Задание стиля left
Стиль Описание
background-color: #FF9966; Задание цвета фона
padding-top: 10px; Задание верхнего отступа
font-family: "Times New Roman", Times, serif; Задание семейства шрифтов. Основным шрифтом объявляется Times New Roman. В случае отсутствия такого шрифта на машине пользователя, будет использован Times. Если же нет и этого шрифта, то будет задействован serif
font-size: 18px; Определение размера шрифта равным 18 пикселям
list-style-type: circle; Определение маркера списка в виде закрашенного кружка
margin-top: 10px; Задание верхнего поля
border-right-width: 2px; Задание толщины правой рамки
border-right-style: solid; Задание стиля линии правой рамки
border-right-color: #990000; Задание цвета правой рамки

Аналогичным образом задаются стили maintitle, towebmaster, epigraphtext и т.д.

Псевдостиль гиперссылки, по которой пользователем не был осуществлен переход:

a:link {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #660000;
}

Псевдостиль гиперссылки, по которой уже был осуществлен переход:

a:visited {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #666666;
}

Псевдостиль гиперссылки в случае прохода над ней курсора:

a:hover {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #FF0000;
}

Псевдостиль активной гиперссылки:

a:active {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #FF3333;
}

< предыдущая оглавление следующая >

Кто Вы?
Исследователь
Специалист
Управленец
Преподаватель
Студент
Аспирант
Другое
Результаты голосования

©Structuralist 2005-2006
structuralist@narod.ru
Рейтинг@Mail.ru Rambler's Top100
Hosted by uCoz