Основы HTML - обязательные теги и создание HTML документа
В данном уроке мы рассмотрим основы HTML.
Как вы уже знаете, большинство веб-страниц в интернет представлены в виде файлов с расширением html. Рассмотрим базовые теги такого документа и их предназначение.
От текстового документа они и отличаются тем что, html документы содержат определенные теги, которые и определяют, каким образом будет выглядеть текст и графика на странице, а также имеют соответствующие расширения файлов.
Материалы по теме:
Для того чтобы браузер понял что данная страница состоит из тэгов и предназначена для него необходимо чтобы она имела определенное расширение. Html документы, имеют расширения .html или .htm.
Сейчас мы создадим простую веб-страницу. Создать html документ, т. е. файл с расширением .html проще простого. Я предлагаю вам создать для этого специальную папку, куда вы будете складывать все то, что мы будем рассматривать в уроках.
Пока в целях изучения языка HTML мы не будем использовать для создания страниц специальные программы, такие например как широко известный HTML редактор Dreamweaver. Наша цель на данном этапе изучить основы html.
Для создания страниц мы воспользуемся стандартным текстовым редактором, который есть в любой версии Windows. Из своей практики я знаю, что данный способ наиболее продуктивен и понятен, для человека который только начал изучение основ HTML.
В дальнейшем же для создания сайта, лучше всего использовать какой либо HTML редактор, это упростит вам работу. Лично я предпочитаю пользоваться редактором Dreamweaver.
А пока воспользуемся текстовым редактором блокнот. Поэтому идем в пункт меню "Пуск" >> "Все программы" >> "Стандартные" - и запускаем текстовый редактор блокнот.
Теперь скопируйте и вставьте в окно блокнота код, который написан ниже, он является основой для любого html файла:
Вставили? А теперь выберите в блокноте пункт меню "Файл" и в раскрывающемся списке пункт “Сохранить как…”, откроется окно сохранения файла. Здесь нас будет интересовать поле "Имя файла". Сюда вам нужно вписать имя нашего файла, например "Моя первая страница", а вместо расширения .txt расширение .html.
Помните о том, что для размещения страниц в интернет названия им дают на английском языке, здесь мы дали название на русском просто в качестве примера. Смотрите на рисунок.
Затем выберите, ту папку, которую вы создали ранее, или любую другую папку на вашем компьютере и сохраните этот файл туда. Сам текстовый документ не закрывайте, мы еще будем с ним работать.
В результате того что Вы вписали код и изменили расширение с .txt на .html мы «превратили» текстовый документ в html документ. Теперь зайдите в ту папку, куда вы сохранили этот файл и откройте его вашим браузером. В результате вы увидите текст: "Вот вы и создали свою первую web страницу!!!"
После этого перейдите назад в наш блокнот, не закрывая окно браузера, и попробуйте поменять текст «Вот вы и создали свою первую web страницу!!!», на какой ни будь свой. Затем пройдите в пункт меню “Файл” >> “Сохранить” и перейдите в открытое окно браузера с этой страничкой, где щелкните по кнопке обновить страницу или нажмите сочетание клавиш Ctrl + R, страница обновится и браузер отобразит уже ваш текст.
Так делайте всегда, когда вы что-то изменили в самом коде, в текстовом редакторе блокнот, и хотите посмотреть, как это будет отображать ваш браузер.
Теперь разберемся, что за теги мы прописали в нашем файле. На самом деле это самые главные тэги html документа, они составляют основу HTML файла и должны быть в каждом HTML документе.
Первые из основных тэгов идущих в нашем коде это <html> </html> эти открывающий и закрывающий теги дают начало и заканчивают html документ, кроме того они дают понять браузеру что этот файл необходимо рассматривать как html документ.
Следующие тэги <head> </head> служат своего рода головой html документа, внутри них размещаются другие тэги, которые содержат определенную служебную информацию. О них мы поговорим в других уроках HTML.
В данном случае <head> </head> содержат теги, <title> </title> в этих тегах размещается название страницы, его вы можете наблюдать в самом верху окна браузера, в нашем примере там будет название «Моя первая страница». И последние теги из нашего кода это <body></body> между этими тегами размещается непосредственно все содержимое веб-страницы, весь текст, графика, таблицы и т. д. Вот так выглядит основа любого HTML файла.
В данном уроке мы рассмотрели теги которые являются обязательными для любого html документа и составляют его основу. В следующих уроках HTML мы рассмотрим, остальные теги и узнаем, за что отвечает каждый тег в отдельности и какие атрибуты присущи тому или иному тегу.
Материал подготовлен порталом: webmastermix.ru
- Подробности
-
Обновлено: 04 Сентябрь 2013
-
Создано: 12 Январь 2010
-
Просмотров: 29153
