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