Структура html страницы.
Доброго времени суток дорогие друзья, за клавиатурой Геннадий Королев. Продолжаем тему создание блога , рубрика html для начинающих. Сегодня рассмотрим раздел — структура html страницы.
Структура html лежит в основе любой веб-страницы в Интернете. Если зайти на произвольный сайт , например на korolevgg.com , и нажать комбинацию клавиш Ctrl+U, вашему вниманию откроется окно с исходным кодом сайта.
Это тот самый код, который вместе с другими файлами приходит к вам на программу – браузер при наборе адреса моего сайта. (смотри статью о работе Интернет здесь)
HTML – (Hyper Text Markup Language ) это специальный язык гипертекстовой разметки документов во всемирной сети интернет. В большинстве случаев web-страницы создаются именно с помощью этого языка.
Любая html cтраница имеет расширение (cпециальный код после названия и точки) html или htm. Чтобы разобрать структуру html страницы, нужно знать, что такое теги, с помощью которых она создается.
Теги – это основные элементы HTML, специальные указания- команды для правильного отображения структуры html документа ( заголовок, параграф, таблица, список )Пишутся латинскими буквами в треугольных скобках.
Как правило большинство тегов – парные : открывающие и закрывающие(перед названием стоит знак слэш “/»), а между ними необходимая информация. Например:
<body> информация </body>
Давайте создадим вашу первую страницу html. Для этого можно использовать обычный текстовый редактор, например из стандартных программ вашего компьютера Notepad (Блокнот).
Откройте эту программу : Пуск – Программы – Стандартные – Блокнот . А лучше иметь ярлык программы Блокнот на рабочем столе или внизу , в панели задач. Кликнули по ярлыку и все.
Структура html страницы.
Напечатаем следующий текст , который и будет являться структурой любого html документа в принципе.
<!DOCTYPE HTML PUBLIC “//W3C//DTD HTML 4.01 Transitional//EN” «http://www.w3.org/TP/html14/loose/dtd»>
<html>
<head>
<title > Мой первый заголовок </title >
</head>
<body>
Привет! Это мой первый сайт
</body>
</html>
Затем посмотрим на ваш первый сайт. Для этого сначала сохраним документ Файл – Сохранить как и выбираем диск и папку – назовем index.html – Cохранить. Затем зайдем в нужную папку и два раза кликнем на сохраненный документ.
То же самое будет, если открыть любой другой браузер и в поисковую строку ввести адрес сохраненного файла ( в рамке А)- Enter
Разберем теги, отвечающие за структуру страницы:
- DOCTYPE – это обязательная строчка, показывает браузеру, что это html документ определенной версии ( в нашем случае 4.01), определенной подверсии и путь, где эта версия.
Так как материал дается в рубрике html для начинающих, на этой строчке особо не заморачивайтесь. Она дается один раз и в основном одинаковая для большинства документов.
- <html> </html> - теги обязательные, открывают и закрывают документ, являются контейнером для всех остальных.
- <head> </head> — теги , открывающие и закрывающие верхнюю (заголовочную) часть документа, содержит служебную информацию для браузера, как отображать данную страницу.
- <title > </title >- теги, необходимые для названия документа, это название отобразится в окне браузера (Смотри рисунок выше: Мой первый заголовок).
- <body> </body> — теги, открывающие и закрывающие тело документа, в котором отображается вся основная информация.
Такова структура html страницы, это обязательные теги именно в этом порядке, когда идет создание блога или сайта. В следующих уроках мы рассмотрим другие теги, которые будут располагаться внутри основных и их порядок уже не имеет значение.
Чтобы не пропустить появление новых уроков, получай новости себе
Для тех , кто участвует активно в Летнем марафоне продолжаем печатать бесплатные кроссворды онлайн, которые нужно побыстрее разгадать, выполняя определенные правила.
Вашему вниманию предлагается бесплатный кроссворд онлайн № 27
:::::::::>> ПРИСТУПИТЬ К РАЗГАДЫВАНИЮ << ::::::::::::
::::::>>ОТПРАВИТЬ ШИФРОВАННУЮ ФРАЗУ<<:::::::::
С уважением Геннадий Королев.
Похожие статьи
Получил полезную информацию? Поделись с друзьями в :
| Твитнуть | ||
| Нравится | ||
Рубрики: HTML для начинающих · Теги: html для начинающих, создание блога
Денис (144)
игорь (60)
Евгения (44)
Максим (24)
Владислав (10)
Crepeer (7)
Андрей (7)
Max (6)
Александр (6)
18.08.2013 в 22:00
· Ссылка
Разгадал кроссворд, фраза отправлена!
19.08.2013 в 14:33
· Ссылка
Фразу отправила
19.08.2013 в 16:19
· Ссылка
Здравствуйте Геннадий!!!Кроссворд разгадал и слово отправил.Мне интересно КТО(Мужчина, который очень беспокоится за свое яйцо).Так я его и не одолел.
19.08.2013 в 16:22
· Ссылка
Игорь, подсказка в русской сказке, там есть такой мужчина.
20.08.2013 в 00:39
· Ссылка
Спасибо кроссворд разгадан.Ответ отправлен