Опубликован: 25.10.2006 | Уровень: для всех | Доступ: платный
Лекция 1:

Введение в HTML

Лекция 1: 1234 || Лекция 2 >

Дополнительные примеры

Лучшим способом изучения HTML является работа с примерами. Рассмотрим несколько примеров, которые иллюстрируют некоторые элементы форматирования документов.

Дополнительные параграфы

Этот пример демонстрирует некоторые особенности поведения по умолчанию элементов параграфа.

<html>
<body>

<p>
Этот параграф 
содержит много строк 
в исходном коде,
но браузер 
это игнорирует.
</p>

<p>
Этот параграф 
содержит     много пробелов
в исходном    коде,
но     браузер 
это игнорирует.
</p>

</body>
</html>

Пример выполнения данного HTML-кода

Перенос строк

Этот пример демонстрирует использование переноса строк в документе HTML.

<html>
<body>

<p>
Чтобы выполнить перенос<br>строк<br>в 
<br>параграфе,<br>используйте тег br.</p>
</body>
</html>

Пример выполнения данного HTML-кода

Этот пример демонстрирует некоторые проблемы с форматированием HTML. Попробуем сформатировать стихи:

<html>
<body>

<p>
  В лесу родилась елочка.
  В лесу она росла.
  Зимой и летом стройная, 
  Зеленая была.
</p>

<p>Обратите внимание, что браузер просто проигнорировал использованное форматирование!</p>

</body>
</html>

Пример выполнения данного HTML-кода

Заголовки

Этот пример демонстрирует теги, которые выводят заголовки в документе HTML.

<html>
<body>

<h1>Это заголовок уровня 1</h1>
<h2>Это заголовок уровня 2</h2>
<h3>Это заголовок уровня 3</h3>
<h4>Это заголовок уровня 4</h4>
<h5>Это заголовок уровня 5</h5>
<h6>Это заголовок уровня 6</h6>

<h1 align="center">Это заголовок 1, он выровнен по центру страницы.</h1>

<p>Используйте теги заголовков только для заголовков. 
Не используйте их просто для того, чтобы выделить что-то жирным шрифтом. 
Используйте для этого другие теги.</p>

</body>
</html>

Пример выполнения данного HTML-кода

Горизонтальная линейка

Этот пример демонстрирует, как использовать горизонтальную линейку.

<html>
<body>
<p>Тег <hr> определяет горизонтальную линейку :</p>
<hr>
<p>Это параграф</p>
<hr>
<p>Это параграф</p>
</body>
</html>

Пример выполнения данного HTML-кода

Комментарий

Этот пример демонстрирует, как использовать комментарий в исходном коде HTML.

<html>
<body>

<!--Этот комментарий выводиться не будет-->
<p>Это обычный параграф.</p>

</body>
</html>

Пример выполнения данного HTML-кода

Фоновый цвет

Этот пример демонстрирует использование цветного фона на странице HTML. При выборе фона всегда проверяйте, чтобы текст был хорошо читаем!

<html>
<body bgcolor="yellow">
<h2>Смотри: Цветной фон!</h2>
</body>
</html>

Пример выполнения данного HTML-кода

Таблица основных тегов HTML

Тег Описание
<html> Определяет документ HTML
<body> Определяет основную часть или тело документа
<h1> -- <h6> Определяет заголовки с 1 по 6
<p> Определяет параграф
<br> Вставляет единичный перенос строки
<hr> Определяет горизонтальную линейку
<!--> Определяет комментарий
Лекция 1: 1234 || Лекция 2 >
Анна Королёва
Анна Королёва

Пожалуйста, уточните, кто автор курса Основы работы с HTML ?

Федор Антонов
Федор Антонов

Здравствуйте!

Записался на ваш курс, но не понимаю как произвести оплату.

Надо ли писать заявление и, если да, то куда отправлять?

как я получу диплом о профессиональной переподготовке?

Анатолий Федоров
Анатолий Федоров
Россия, Москва, Московский государственный университет им. М. В. Ломоносова, 1989
Галина Матрук
Галина Матрук
Молдова, Республика, Кишинев, UTM, 2010