Шрифт:
Мы рады приветствовать вас на сайте нашей компании ООО «Мир торговли». Уже более пяти лет мы занимается продажей товаров и оказанием услуг. Ниже представлены списки основных позиций, которые мы рады предложить.
Товары:
промышленные товары;
строительные материалы;
одежда, обувь;
детские игрушки.
Услуги:
грузоперевозки;
ответственное хранение;
юридическое консультирование.
Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.
Этот текст на нашей странице поначалу будет включать в себя следующие элементы: заголовки первого и второго уровней, курсивный, полужирный и подчеркнутый текст, а также маркированный и нумерованный списки. После этого мы переделаем списки в таблицу, и вставим на страницу изображение.
Форматирование текста
Используя имеющиеся знания, напишем программный код так, чтобы поначалу выделить на странице ее название и заголовок первого уровня, которым будет являться текст Добро пожаловать!. Этот код представлен в листинге 1.1.
Листинг 1.1. Выделение названия страницы и заголовка первого уровня
<html>
<head>
<title>Компания "Торговый мир"</title>
</head>
<body>
<h1>Добро пожаловать!</h1>
Мы рады приветствовать вас на сайте нашей компании ООО «Мир торговли». Уже более пяти лет мы занимается продажей товаров и оказанием услуг. Ниже представлены списки основных позиций, которые мы рады предложить.
Товары:
промышленные товары;
строительные материалы;
одежда, обувь;
детские игрушки.
Услуги:
грузоперевозки;
ответственное хранение;
юридическое консультирование.
Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.
</body>
</html>
Обратите внимание: в отличие от рассмотренного ранее примера, заголовок веб-страницы мы заключили не только в теги <title> </title>, но и поместили в контейнер <head> </head>.
Сохраним программный код в файле под названием Компания.html, и откроем его в окне Интернет-обозревателя. Результат выполненных действий показан на рис. 2.15.
Рис. 2.15. Название страницы и заголовок первого уровня
Теперь изменим программный код так, чтобы первая после заголовка фраза была написана курсивом, во второй фразе слова пяти лет – подчеркнутым шрифтом, а третья фраза – полужирным шрифтом. Кроме этого, слова Товары и Услуги будут у нас начинаться с новой строки.
Листинг 1.2. Первые действия по форматированию текста
<html>
<head>
<title>Компания "Торговый мир"</title>
</head>
<body>
<h1>Добро пожаловать!</h1>
<i>Мы рады приветствовать вас на сайте нашей компании ООО «Мир торговли»</i>. Уже более <u>пяти лет</u> мы занимается продажей товаров и оказанием услуг. <b>Ниже представлены списки основных позиций, которые мы рады предложить</b>.<br>
Товары:
промышленные товары;
строительные материалы;
одежда, обувь;
детские игрушки.<br>
Услуги:
грузоперевозки;
ответственное хранение;
юридическое консультирование.
Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.
</body>
</html>
Сохраним выполненные изменения, и откроем страницу в окне Интернет-обозревателя – результат показан на рис. 2.16.
Рис. 2.16. Использование разных стилей шрифта и разделение текста на абзацы
Теперь нам нужно перечень предлагаемых компанией товаров представить в виде маркированного списка. Об этом читайте далее.