HTML - урок 1

[Оглавление] [Далее]

Структура Web-страницы

1. При создании сайта в Windows, обязательно в настройках отразите показ расширений файлов. В Linux (ALT Linux Школьный, Ubuntu) расширения видны. Иначе, например, при создании файла стилей styles.css в Блокноте в действительности будет файл styles.css.txt.

2. Создайте на диске отдельную директорию (папку) для будущей страницы, например: site_ivanov. В ней создайте ещё две папки: images (для изображений) и styles (для файла стилей).

Теги HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> - необходимо, чтобы браузер понимал, по какому стандарту отображать текущую страницу.
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> - тег, указывающий браузеру кодировку страницы у которой не будет проблем с русскими буквами (кириллицей)

<html> </html> - формат документа
<head> </head> - заголовок
<title> </title> - название страницы
<body> </body> - содержание страницы
<h1> </h1> - заголовок первого уровня

3. Откройте текстовый редактор KWrite или Gedit (в Windows - Блокнот) и скопируйте туда следующий HTML-код:

<!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" />
</head>
<body>
<h1>Всё о компьютере</h1>
</body>
</html>
(Показать)

4. Сохраните этот документ в созданную папку, например, в папку site_ivanov, присвоив ему имя index.html

5. Не закрывая KWrite, Gedit или Блокнот (он еще пригодится), откройте сохраненный файл index.html в браузере.

6. Если что-то не получилось, исправляйте в текстовом редакторе KWrite, Gedit или Блокноте. Чтобы посмотреть как это выглядит в браузере, надо не забывать нажимать в браузере кнопку ОБНОВИТЬ. Если изменений не видно, то это значит, что где-то в HTML-коде есть ошибка или документ забыли сохранить.

[Оглавление] [Далее]

Все права защищены. © 2015. Хайманова Т.Я.