Не меняя HTML-код (оперируя только CSS), создайте оформление, вид которого показан на рисунке в конце этой страницы.
Стилевые определения записывайте в отдельный файл с именем
task05.css, а HTML-код — в файл task05.htm.
Файлы сохраняйте в каталоге, который укажет учитель.
В качестве средств оформления используйте свойства, приведённые в таблице.
| Свойство | Описание и возможные значения |
|---|---|
color |
Задаёт цвет текста. Значения: название цвета (например, red) или его номер
(как в соответствующем атрибуте HTML, например, #ff0000).
|
background |
Задаёт цвет фона элемента. Значения: название цвета или его номер. |
margin |
Определяет размер внешнего отступа элемента: со всех сторон (margin)
или с только с соответствующей стороны.
Значения: число с допустимой единицей измерения (например, px).
Можно записывать значение в виде процента от родительского элемента.
|
padding |
Определяет размер внутреннего отступа
со всех сторон (padding)
или с только с соответствующей стороны.
Значения: число с допустимой единицей измерения (например, px). Можно
записывать значение в виде процента от родительского элемента.
|
borderborder-leftborder-rightborder-topborder-bottom |
Задаёт границу (рамку) элемента
со всех сторон (border)
или с только с соответствующей стороны.
Значение записывается в формате:
толщина стиль цвет.
Например,
border:1px solid red. Некоторые значения стиля рамки:
solid (сплошная линия), dashed (штриховая линия),
double (двойная линия).
|
text-align |
Задаёт способ выравнивания внутри элемента.
Значения: left, right, center,
justify.
|
В качестве текстового редактора используйте PSPad
или Блокнот. Заготовки файлов скопируйте в
текстовый редактор через буфер обмена.
Файл task05.css
/* Стили страницы
--------------
Цвета текста и фона
Внешний отступ слева
Серая сплошная рамка слева */
BODY
{
}
/* Стили заголовка
---------------
Цвет текста
Выравнивание по центру */
H1
{
}
/* Стили содержания
----------------
Внутренний отступ
Выравнивание по ширине
Сплошная серая рамка сверху и снизу */
DIV
{
}
Файл task05.htm