Осваиваем HTML Занятие 1
Скелет HTML-документа
Планирую написать большую серию статей по HTML от основ до мелких нюансов работы, а затем перейти к сериям статей по PHP и JavaScript. Это первая статья серии осваиваем HTML.
Прежде чем начать работу с html, давайте рассмотрим, что это понятие означает.
Итак, HTML (англ. HyperText Markup Language – Язык разметки гипертекста), это не язык программирования, а именно стандартизованный язык разметки текста (документов) во Всемирной паутине Интернета.
Каждая вещь имеет свою структуру, строение, так же, как и HTML-страница. Эта страница содержит в себе шапку, название, дальше текст, «тело» документа, и напоследок – подписи, например. Документ содержит теги, которые нужны не для того, чтобы нас запутать, или просто для красоты, они говорят браузеру, как нужно интерпретировать текст, служебные слова, символы, которые он увидит на странице HTML документа. Код html содержит много элементов, которые могут обозначать цвет, шрифт, выделения, абзац, списки, различные таблицы, ссылки, картинки…
Для создания своих веб-страниц вам понадобится минимум – программа «блокнот», ёё можно легко найти, так как она идет в комплекте windows в панели «пуск» – «все программы» – «стандартные» – «блокнот».
Итак, давайте начнем!
Откройте блокнот и впишите туда следующее:
<html>
</html>
Возникают различные вопросы – «Что это? Почему они в таких скобках? Что такое тег? .. »
Тег – это команда браузеру выполнить действия.
Если мы напишем, эти теги без скобок, браузер расценит это, как обычный текст и сделает его видимым. А нам нужно, чтобы это было для браузера как команда, приказ.
Данный тег, что вы написали означает, что наш документ написан на языке HTML. Обязательно не забывайте теги закрывать, значком «/», поскольку не будет выполнена операция, будет считаться незавершенной и может быть выполнена не корректно.
Далее впишите туда теги, они и получим основной скелет HTML-документа
<head>
</head>, чтобы получилось так:
<html>
<head>
</head>
<body>
</body>
</html>
Так выглядит основной скелет HTML-документа.
Но давайте разберемся и с этими тегами. Как вы знаете, слово «head» на английском означает «голова», а слово «body» – тело. Такое же значение эти слова имеют здесь.
HEAD – «голова» документа. Тут прописываются название страницы и сайта, коды текста.
Тег BODY – «тело»: в нем содержится вся основная информация страницы, то, что мы видим, читаем, смотрим …
Сохраните данный документ с расширением HTML, например, 1.html.
Если Вы откроете его в любом браузере, то можете увидеть свою первую страничку! Но с такими элементами, как мы написали, мы ничего не увидим, страница будет пустой. Давайте продолжим редакции HTML документа.
Для этого снова откройте документ в блокноте или можете использовать другой текстовый редактор. Для этого выделите файл и нажмите правой клавишей, выберите пункт меню открыть с помощью, далее укажите блокнот или другой привычный вам текстовый редактор, Вордом на начальном этапе изучения HTML лучше не пользоваться.
Существует тег <title>, отвечающий за имя (название). Давайте впишем следующее:
<html>
<head>
<title> Осваиваем HTML, моя веб-страница. </title>
</head>
<body>
</body>
</html>
Если данный документ снова сохранить и открыть в браузере, то увидим сверху наше название страницы. Если вы не закрывали страницу в браузере с первого раза, то просто обновите страницу через меню браузера или нажав функциональную клавишу F5.
Но давайте не останавливаться на начальной стадии, а впишем следующее между тегами BODY:
<h1> Заголовок на веб-странице </h1>
Таким образом, у нас получится:
<html>
<head>
<title> Осваиваем HTML, моя веб-страница. </title>
</head>
<body>
<h1> Заголовок на веб-странице </h1>
</body>
</html>
В результате вы должны получить
Тег h1 означает заголовок нашего будущего текста.
А теперь мы можем это сохранить, для этого достаточно нажать Cntr+S или воспользоваться меню текстового редактора. Открыть html документ в браузере (обновляем) и увидим наш первый результат.
Существует очень много интересных и полезных тегов, которые стоят того, чтобы их рассмотреть, мы рассмотрели пока только начальные, формирующих наш документ.
Автор: Алекс
по заказу https://wmr1000.ru/
Сделать закладку: