Изучаем HTML. Часть 1 — Основы

**Admin** Пн Ноя 01, 2010 10:20 pm

Этой темой я начинаю цикл статей по веб-дизайну. Начинать надо с самого начала. А начало всего веб-дизайна — это html.

Что такое страничка в интернете? Это всего лишь файл, в котором по определенным правилам описано ее содержание. Сейчас мы с Вами создадим нашу первую html страничку, которую Вы сможете тут же и посмотреть.

Создавать html странички можно в любом текстовом редакторе. На первых порах вполне подойдет обычный «Блокнот» Windows. Открываем его.

Перед нами пустой файл — пустая страничка. Давайте начнем ее заполнять. Перед тем, как что-то писать в файле надо понять как ваш браузер (программа для просмотра страничек — обычно Internet Explorer) будет его показывать. Весь текст файла будет состоять из двух составляющих — сам текст и специальные указания для браузера, как показывать этот текст. Эти указания называются тегами.

Теги — это основные элементы html странички. Они всегда пишутся внутри треугольных скобок: < и >.

Теги бывают одиночные, например:

Код HTML:
<br> <hr> <img>А бывают парные (их еще называют контейнерами):

Код HTML:
<div>содержание</div>
<h1>содержание</h1>Как видно из примеров, внутри парных тегов надо поместить какое-то содержание. Парные теги бывают открывающие и закрывающие (начинаются с символа /). Содержание тоже может включать в себя другие теги, в том числе и парные. Закрытие содержимого обязательно надо делать в порядке, обратном открытию.
Пример:

Код HTML:
<div><p>Правильный пример.</p></div>Код HTML:
<div><p>Неправильный пример.</div></p>Код HTML:
<div>Тоже <p>правильный пример</p> использования тегов.</div>Хватит теории! Давайте перейдем к практике.
Вписываем в наш пока что пустой файл:

Код HTML:
<HTML>
<HEAD>
<title>Моя первая html страничка</title>
</HEAD>
<BODY>
Всем привет!
</BODY>
</HTML>Сохраняем. Например, как firstpage.txt. Теперь меняем расширение файла на html — получится firstpage.html. Этот файл уже можно открыть браузером. Открыли? Обратите внимание на заголовок окна — там должен быть текст «Моя первая html страничка». А внутри окна — «Всем привет!». Поздравляю, Вы только что создали свою первую html страничку.

Так должна выглядеть страничка: Посмотреть пример.

Надо все таки разобраться, что написано внутри файла. А там находится всего 4 парных тега:
<HTML>…</HTML> — объявление html документа. Внутри этих тегов должно находиться все содержание страничек.
Содержание страничек делится на 2 раздела:
<HEAD>…</HEAD> — заголовок странички.
<BODY>…</BODY> — тело странички.
Внутрь заголовка мы вписали:
<title>…</title> — объявление заголовка для окна браузера.
А в тело документа просто списали текст.

Как Вы видите, имена тегов можно писать как заглавными, так и строчными буквами. Можно даже вперемешку: <hTmL>. Это ни на что не повлияет.

Давайте дальше знакомиться с тегами html.
Есть такой полезный тег, который воспринимается браузерами как комментарий:
 — тег комментария.
Комментарий никак не будет показан и не влияет на оформление текста. Его удобно использовать для напоминаний самому себе или для временного скрытия ненужных кусков. Давайте дополним комментариями нашу страничку:

Код HTML:
<HTML>

<HEAD>

<title>Моя первая html страничка</title>
</HEAD>
<BODY>
Всем привет!

</BODY>

</HTML>Вот что должно получиться: Посмотреть пример.

На этом, пожалуй, с основами HTML можно и закончить. Дальнейшее изучение тегов html мы продолжим в следующих частях.

В этой теме я жду Ваших вопросов только по основам.