Не меняя HTML-код (оперируя только CSS), создайте оформление, вид которого показан на рисунке в конце этой страницы.
Стилевые определения записывайте в отдельный файл с именем
task03.css, а HTML-код — в файл task03.htm.
Файлы сохраняйте в каталоге, который укажет учитель.
В этом каталоге есть подкаталог
pic, в котором содержатся картинки.
Файл task03.css
/* Стили HTML
----------
Белый цвет фона */
HTML
{
}
/* Стили BODY
----------
Относительное позиционирование: чтобы смещения
абсолютно позиционированного потомка sidebar (боковая
панель) отсчитывать от BODY, а не от HTML.
Уменьшенный шрифт Georgia (если нет, то любой с засечками)
Внешний отступ в 10 пикселов
Нулевой внутренний отступ
Сплошная рамка цвета #638F7B толщиной в 1 пиксел
Цвет текста #2A3D34
Белый цвет фона и фоновая полоска для создания
эффекта ложных колонок. Фоновая полоска -- картинка
fon.png шириной в 3000 пикселов. Первые 1200 пикселов
окрашены в цвет боковой панели
Ограничение минимальной ширины в 640 пикселов
*/
BODY
{
}
/* Заголовочная часть
------------------
Нулевой внешний отступ
Внутренний отступ в 10 пикселов (со всех сторон)
Сплошная рамка снизу цвета #638F7B толщиной в 1 пиксел
Белый цвет фона и фоновая заливка (файл h1bg.gif)
*/
#header
{
}
/* Боковая панель
--------------
Абсолютное позиционирование в (0,121)
Ширина блока 40% от BODY
*/
#sidebar
{
}
/* Обёртка содержимого боковой панели
----------------------------------
Внутренний отступ в 10 пикселов (со всех сторон)
Заклинание zoom:1; для IE
*/
#sidebar .wrap
{
}
/* Содержание
----------
Внешний отступ слева шириной в 40% от BODY
Внутренний отступ в 10 пикселов (со всех сторон)
Заклинание zoom:1; для IE
*/
#content
{
}
/* Подвал
------
Сплошная рамка сверху цвета #638F7B толщиной в 1 пиксел
Цвет текста -- белый
Цвет фона -- #828377
Внутренний отступ по 5 пикселов сверху и снизу
и по 10 пикселов слева и справа
Уменьшенный на 30% шрифт Tahoma (если нет,
то любой без засечек)
Запрет переноса строки
*/
#footer
{
}
/* Заголовки
---------
Цвет #009900
Приближаем заголовок к своему абзацу:
внешнее поле сверху -- 0.6em
внешнее поле снизу -- 0.2em
*/
H2, H3, H4, H5, H6
{
}
/* Абзацы
------
Приближаем заголовок к своему абзацу:
внешнее поле:
сверху -- 0.2em
слева и справа -- 0
снизу -- 1em
*/
P
{
}
/* Выделение
---------
Жирный шрифт
*/
EM
{
}
/* Рисованный маркер списка
------------------------
Картинка для маркера -- marker.gif
*/
UL
{
}
/* Выделение фрагментов кода
-------------------------
Увеличенный на 2% шрифт Trebuchet MS (или моноширинный)
Запрет переноса строки
*/
CODE
{
}
Файл task03.htm
