возврат

Стили сайта и фон элемента

Практикум

Задание 1

Создайте документ, вид которого показан на рисунке в конце этой страницы.

Стилевые определения записывайте в отдельный файл с именем task01.css, а HTML-код — в файл task01.htm. Файлы сохраняйте в каталоге, который вам укажет учитель. В этом каталоге есть подкаталог pic, в котором находится картинка fon01.jpg (шириной в 90 пикселов и высотой в 1 пиксел):

Картинка для фона

Используйте эту картинку для создания вертикальной полоски у левой границы окна.

В качестве средств оформления используйте свойства, приведённые в таблице.

Свойство Описание и значения
color Задаёт цвет текста. Значения: название цвета или его номер (как в соответствующем атрибуте HTML).
background Значение свойства записывается в виде последовательности параметров:
цвет скролл повтор координаты картинка
Посмотреть
margin-left Определяет размер внешнего отступа элемента слева. Значения: число с допустимой единицей измерения (например, px). Можно записывать значение в виде процента от родительского элемента.
padding-left Определяет размер внутреннего отступа слева (расстояние между содержимым и границей элемента слева). Значения: число с допустимой единицей измерения (например, px). Можно записывать значение в виде процента от родительского элемента.
padding-right Определяет размер внутреннего отступа справа (расстояние между содержимым и границей элемента справа). Значения: число с допустимой единицей измерения (например, px). Можно записывать значение в виде процента от родительского элемента.
text-align Задаёт способ выравнивания внутри элемента. Значения: left, right, center, justify.

В качестве текстового редактора используйте PSPad или Блокнот. Заготовки файлов можно скопировать в текстовый редактор через буфер обмена.

Файл task01.css

  
/* Цвет текста, фона, 
   фоновая картинка, 
   внешний отступ элемента слева */  
BODY
{
}

/* Цвет текста, выравнивание по центру */  
H1
{
}

/* Внутренние отступы слева и справа, 
   выравнивание по ширине */  
DIV
{
}

Файл task01.htm

  

Над облаками

Вверх вверх | возврат

© Александр Александрович Дуванов kurs@robotland.pereslavl.ru