Теги HTML - основа создания web-страниц

Освоение языка html и изучение тегов html лучше всего самостоятельно создавая свою первую интернет страничку. Для этого нам будет достаточно уже внедренного в Windows приложения — обыкновенный "Блокнот".

Но чтобы вы были в курсе: для написания Web-страниц разработано много спец. приложений — Web-редакторов. С их помощью, даже не представляя, что такое язык html, можно штамповать web-странички не заморачиваясь. К примеру всем знакомый редактор Adobe Dreamweaver.

Однако, на данном этапе, использование таких программ большей пользы нам не принесет. Пользуясь обыкновенным "Блокнотом" вы сумеете более основательно изучить язык html и теги html. Даже примеры html-кодов здесь поданы не как текст, а как изображение. Скопировать не удастся, только набирать с клавиатуры.

И так, открываем Блокнот и набираем в нем html-код, который видим в листинге 1.1.

Теги HTML

После написания сохраняем созданный нами файл ("сохранить как"), но при этом дадим имя файлу, например, dokument1. Вместо расширения .txt проставим расширение .htm и сменим кодировку файла на UTF-8. Вот так мы создали файл dokument1.htm Осталось лишь проверить как он выглядит в браузере.

Но есть одно "но". Созданные вами страницы сайтов, по возможности, желательно проверять в нескольких более распространенных браузерах, так как не все web-обозреватели могут одинаково отображать html-документ. Так что могут всплывать непредвиденные ошибки.

Получили вот такой результат (рис.1.3)

Наша первая Web-страница

Вот наша первая web-страничка. Мы видим крупный заголовок. Абзац, разделенный на строки автоматически и одно слово, выделенное полужирным шрифтом.

Давайте теперь разберемся, что же мы прописали в нашем файле dokument1.htm. Рассмотрим, пока, только небольшую часть html-кода (листинг 1.2)

Код HTML

Первым делом мы наблюдаем текст, который, при открытии файла dokument1.htm виден в браузере. А еще видим буквы и слова, заключенные в скобки угловые < и >. Вот они как раз и называются - теги HTML. Это, именно, с их помощью та или иная часть html-кода преобразуется в какой то элемент страницы.

Теги <h1> и </h1>. Текст, прописанный внутри этих двух тегов, на странице будет заголовком и имеет название "содержимое" тега. Тег <h1> отмечает начало и называется "открывающий" тег. </h1> завершает фрагмент текста и называется "закрывающий". Различие между ними лишь в наличии слеша /. Теги, имеющие и "открывающий" и "закрывающий" тег называют парными.

И так, мы выяснили, что все html-теги — это угловые скобки < и > внутри которых размещено имя тега. Именно оно определяет предназначение тега.

Продолжим. Далее мы видим html-тег <p>. Есть и открывающий тег и закрывающий — значит этот тег html парный. Текст, прописанный внутри него, становится абзацем web-страницы.

Парный тег <strong> вложили внутрь тега <p>. Значит все, что внутри тега <strong> будет частью абзаца (тега <p>). Как вы уже заметили, этот тег отвечает за написание текста полужирным шрифтом.

В завершение запомним три правила написания кода html:

- имя тега можно прописывать и строчными (маленькими) буквами и прописными (большими)

- внутри угловых скобок < и > и в самом имени тега не должно быть переноса строк и пробелов

- в прописанном тексте не допустимо присутствие символов угловых скобок < и >. Это, так званые, недопустимые символы.