Начну,
пожалуй, с начала..
HTML язык по
своей сути не является языком программирования.. он является языком разметки
гипертекстовых документов. Иными словами он отвечает за расположение в
документе Ваших текстов, рисунков, таблиц.. предназначенных для жизни в сети
Интернет. Заставить его посчитать, сколько будет дважды два невозможно, в нем
нет логических функций, зато красиво и главное легко выложить информацию о том,
что дважды два будет четыре - это запросто. Читается этот язык при помощи
знакомых Вам программ, именуемых браузерами (обозревателями), которые
"знают" стандартные команды html языка, и "пережевывая" их
выводят на монитор компьютера документы в том виде, в котором хочет представить
их веб мастер - составитель документа.
Теперь о
командах - их называют дескрипторами, но чаще - тегами.
Вернемся к
нашей первой страничке.. итак мы написали:
<html>
<head>
<title>Моя первая страничка</title>
</head>
<body>
Привет мир!!!
<br>
Меня зовут Карлсон, это моя первая страничка!
</body>
</html>
<head>
<title>Моя первая страничка</title>
</head>
<body>
Привет мир!!!
<br>
Меня зовут Карлсон, это моя первая страничка!
</body>
</html>
Так вот то что
написано между <…> - называют тегами они не видны читателю, заглянувшему
на Вашу страницу, зато хорошо видны браузеру, который наткнувшись на тег <html> понимает его как сигнал к тому, что
далее будет документ, который необходимо прочитать и вывести на монитор в
нужном виде.. а вот тег </html>
говорит о том что документ закончился и от него, то бишь браузера, больше
ничего не требуется и он может отдыхать с чистой совестью.
Так что же
мы написали? и как это читает браузер?
Мысли
браузера:
<html> - начало
документа.. опять работы привалило..
<head> - смотрим словарик английского переводим "голова" …в голове моей опилки не беда!! ... здесь указывается основная служебная информация о документе.. ну и что они там от меня хотят?
<title> - "название" значит.. это в шапке окна нужно написать его название:
Моя первая страничка - опять чайник тренируется..
</title> - все название закончилось.. можно идти дальше..
</head> - ага и в голове кроме названия больше никаких вздорных мыслей не держим..
<body> - "тело" документа всё что написано ниже выставляем на всеобщее обозрение
Привет мир!!! - как мило! Достали уже!!!
<br> - переносим текст на следующую строчку.. я даже догадываюсь что в ней будет...
Меня зовут (здесь Ваше имя), это моя первая страничка! - ну да так и есть.. ничего пооригинальнее придумать не могут..
</body> - что всё что ли? Больше ничего не отображать?
</html> - ну вот и конец!! Не будить, не кантовать, при пожаре выносить первым!!
<head> - смотрим словарик английского переводим "голова" …в голове моей опилки не беда!! ... здесь указывается основная служебная информация о документе.. ну и что они там от меня хотят?
<title> - "название" значит.. это в шапке окна нужно написать его название:
Моя первая страничка - опять чайник тренируется..
</title> - все название закончилось.. можно идти дальше..
</head> - ага и в голове кроме названия больше никаких вздорных мыслей не держим..
<body> - "тело" документа всё что написано ниже выставляем на всеобщее обозрение
Привет мир!!! - как мило! Достали уже!!!
<br> - переносим текст на следующую строчку.. я даже догадываюсь что в ней будет...
Меня зовут (здесь Ваше имя), это моя первая страничка! - ну да так и есть.. ничего пооригинальнее придумать не могут..
</body> - что всё что ли? Больше ничего не отображать?
</html> - ну вот и конец!! Не будить, не кантовать, при пожаре выносить первым!!
Вот так
примерно и происходит чтение нашей странички.. Как видите браузер довольно
своенравный тип, поэтому команды ему нужно подавать чёткие и ясные, иначе он
разругается.. причем в слух.. а по сему запомним следующие вещи:
Необходимо раз и навсегда запомнить что если есть
открывающий тег <…> то обязательно
должен быть и закрывающий </…>
Хотя есть и
исключения как например у нас тег <br>
- он закрытия не требует потому что говорит лишь о том, что следует писать с
новой строки. Кстати попробуйте добавить еще пару тройку таких же перед
строчкой "Меня зовут.." и Вы увидите, что в результате она заметно
опустилась вниз.. (Ну естественно в блокноте сохраните изменения, а в браузере
нажмите кнопку "обновить")
Все документы должны иметь вот такой шаблон кода:
<html>- начало
документа
<head>- начало головы
</head>- закрытие головы
<body>- начало тела
<head>- начало головы
</head>- закрытие головы
<body>- начало тела
Видимая часть документа
</body>- закрытие тела
</html>- конец документа
</body>- закрытие тела
</html>- конец документа
Данные теги
являются обязательными! Писать их необходимо всегда для каждой новой странички,
и только в таком порядке! Не пытайтесь перевернуть всё с ног на голову..
Ну вот мы
научились писать простой текст, начало положено! в следующей главе я расскажу о
том, что с ним можно сделать..
Полезные советы:
- При написании сайта создайте папку в любом удобном месте на Вашем жёстком диске, называйте как угодно, лишь бы понятно было.. в эту папку сохраняете Ваши странички, присваивая им осмысленные имена.. варианты типа ааа.html, 123.html приведут к беспорядку и путанице… На данном этапе этот совет не покажется дельным, но в дальнейшем это значительно облегчит Ваш труд. Представьте к примеру хотя бы 20-30 таких файлов названия которых нужно держать в голове, чтобы связать их перекрёстными ссылками. Порядок, прежде всего!
- При написании кода советую придерживаться "хорошей манере письма", то есть писать теги "лесенкой" по мере вложенности одного тега в другой.
Немає коментарів:
Дописати коментар