Форматирование текста на Web-странице

Вот теперь нам придётся подключать файл стилей. В HTML-код будет добавлена строка, в которой указан путь к файлу стилей:
<link rel="stylesheet" type="text/css" href="styles/styles.css" />
Ниже в HTML-коде вы это увидите, все изменения выделены жирным курсивом.
<hr /> - горизонтальная линия

Задание

1. Откройте текстовый редактор KWrite или Gedit (в Windows - Блокнот) и скопируйте туда CSS-код со вставленными комментариями, которые писать не обязательно, можно удалить. Комментарии пишутся между знаками /* и */

h1 { /*заголовок первого уровня*/
color: blue; /*цвет синий, другие цвета: red, green, yellow, violet...*/
font-size: 140%; /*размер шрифта*/
}
.right { /*Для класса right (class="right")*/
text-align: right; /*Выравнивание по правому краю*/
}
.left { /*Для class="left"*/
text-align: left; /*Выравнивание по левому краю*/
}
.center { /*Для class="center"*/
text-align: center; /*Выравнивание по центру*/
}

2. Сохрание файл с именем styles.css в папку styles вашего сайта.

3. Откройте с помощью текстового редактора KWrite, Gedit или Блокнот файл index.html.
4. Внесите изменения, скопировав нужные строки HTML-кода (выделены жирным курсивом) и добавив их на Web-страницу с применением к тексту форматирования.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru">
<head>
<title>Компьютер</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="styles/styles.css" />
</head>
<body>
<h1 class="center">Всё о компьютере</h1>
<hr />
<p class="left">На этом сайте вы сможете получить различную информацию о компьютере, его программном обеспечении и ценах на компьютерные комплектующие.</p>
<p class="right">Терминологический словарь познакомит вас с компьютерными терминами, а также вы сможете заполнить анкету с помощью интерактивной формы.</p>
</body>
</html> (Показать)

Фон Web-страницы

[Назад] [Оглавление] [Далее]