HTML: первая веб-страница
Знакомимся с языком HTML и учимся создавать простую веб-страницу с заголовком, текстом, списком, ссылкой и рисунком с помощью тегов.
Список тем (9 из 11)
Глава 1. Электронные таблицы
Глава 2. Базы данных
Глава 3. Компьютерные сети и веб
Глава 4. Системы счисления
HTML — это язык разметки для создания веб-страниц. Он не язык программирования: с помощью тегов HTML сообщает браузеру, какая часть текста — заголовок, какая — абзац, рисунок или ссылка. Тег записывают в угловых скобках, и большинство тегов парные: открывающий <p> и закрывающий </p>.
Структура страницы такова: <html> охватывает весь документ, внутри <head> находится название страницы (<title>), а внутри <body> записано всё, что видно на экране. Основные теги: <h1>…<h6> — заголовки, <p> — абзац, <ul> и <li> — маркированный список, <a href="..."> — ссылка, <img src="..." alt="..."> — рисунок. Текст набирают в редакторе (Блокнот), сохраняют файл с расширением .html и открывают в браузере.
Вот самый простой пример страницы:
``html
<!DOCTYPE html>
<html>
<head><title>Моя страница</title></head>
<body>
<h1>Привет!</h1>
<p>Я изучаю информатику.</p>
<a href="https://informatik.uz">Перейти на сайт</a>
</body>
</html>
`
Измените текст, сохраните файл и обновите страницу в браузере (F5`): изменения сразу видны.
Главное
- HTML — язык разметки веб-страниц, а не язык программирования.
- Теги записывают в угловых скобках; большинство из них парные.
- Страница состоит из частей
<html>,<head>и<body>. - Файл сохраняют с расширением
.htmlи открывают в браузере.
Практические задания
- Наберите в Блокноте приведённый пример, сохраните как
sahifa.htmlи откройте в браузере. Замените заголовок на своё имя. - Добавьте на страницу заголовок
<h2>«Мои любимые предметы» и список<ul>минимум из трёх пунктов. - Добавьте на страницу рисунок (
<img>) и ссылку (<a>) на какой-нибудь сайт; не забудьте текстaltдля рисунка.
Вопросы для закрепления
Проверьте себя: сначала подумайте, потом откройте ответ.
1Является ли HTML языком программирования?Показать ответСкрыть ответ
Нет, это язык разметки: он описывает структуру страницы, а не выполняет алгоритмы.2Что записывают внутри тега `<body>`?Показать ответСкрыть ответ
Всё, что видно на странице: текст, рисунки, ссылки.
Войдите на сайт
Слайды и PDF доступны только зарегистрированным пользователям: и просмотр, и скачивание. Вход бесплатный.
Войдите на сайт
Слайды и PDF доступны только зарегистрированным пользователям: и просмотр, и скачивание. Вход бесплатный.
Пройдено тем: 0 из 11
Войти и отметить