HTML (HyperText Markup Language) или по-русски язык гипертесктовои разметки - это язык разметки текста в Интернете. Практически все сайты исползуют этот язык. Именно HTML принимает ваш браузер с сервера, обрабатывает его и показывает вам готовую страницу.
Сам HTML представляет собой текст, который перемешивается со специальными командами. Эти команды называются тегами и размещаются между открывающей (<) и закрывающей (>) кавычками. Например, тег br - это команда переноса строки, в HTML она пишется как <br>. Теги могут быть одиночными или требующими закрытия. Тег br - это одиночный тег, поскольку означает команду конца строки текста, которая выполняется сразу. В то же время тег u (команда выделить часть текста подчеркиванием) требует закрытия. Такая команда накладывается на весь текст, который размещается между открывающим тегом <название_тега> и закрывающим </название_тега>.
И так даваите рассмотрим простеиший пример :
Откроите ваш простои Notepad. Затем пишем следущее :
| Code |
| CODE <html>
<head>
<title>My first page</title>
</head>
<body>
Hello, World. This is my first homepage.
</body>
</html>
|
Теперь давайте рассмотрим, что же мы написали ...
Первои строикои идут знакомые нам буквы "html" и, как ранее говорилось, они заключены в кавычки, что говорит о том, что это не просто слово, а уже команда. Эта команда даёт понять броузеру, что от сюда начинается разметка выводимои информаций на экран. Как уже говорилось ранее, теги, межды которыми размешается какая-либо информация, имеют как начало, так и конец, и если вы обратите внимание в самый низ, то увидете там , что означает конец этого тега </html>, а значит и конец разметкам для отображения, и если вы поставите какои либо тег за пределами, то он уже не будет являтся тегом, а будет лишь текстом. Далее идёт "head" или как её называют "шапка" документа, в которой обучно содержится так называемая мета-информация или информация об информации. Другими словами здесь находится информация, описывающая информацию, которая будет отображаться на странице. Так же в "шапке" задаются ссылки на библиотеку шрифтов и скриптов, которые так же будут применены к отображаемому тексту. Подробнее об этом разделе вы сможете узнать создав топик с вопросом об интересующей вас информации по поводу возможностей "шапки". На данный момент в ней находится лишь тег title. Благодаря именно этому тегу мы видим, то или иное название на синеве окна браузера, как на Степашке мы видим Stepashka.com Forum... Далее мы видим как шапка закрывается, что означает, что мы закончили вводит мета-информацию и переходим к телу документа или "body".
Именно в теле документа содержится всё то, что вы наблюдаете на своих экранах. Находится ли текст справа или слева, где расположены картинки и так далее. Вобщем что где расположить - это и есть основная задача HTML. Далее следует текст, который будет выведен при запуске страницы...я не стал ставить много различного на первый раз... как говорится : "Главное понять принцип работы.", а остланое вы сможете спросить в топике. Далее мы закрываем тело и закрываем сам html.
Ну вот, вроде написали, хотелось бы и посмотреть. Нажимаетм "Сохранить как..", пишем в название "index.html", выбераем тип сохраняемого документа как "Все файлы" и нажимаем сохранить.Теперь вы видите, что иконка у сохранённого файла изменилась на иконку согласно браузеру. Запускем её ... и вот перед вами не совсем творение Пикассо, но первые предпосылки к этому...
Давайте разнообразим немного это скудное произвидение ... Для этого вам нужно заити на этои странице в меню "View" слева наверху под синевои, если вы используете Internet Explorer. Там выберете третью снизу графу "Source". Перед вами окажится уже знакомый вам ваш текстовои файл. Внесите туда следушие изменения :
| Code |
| CODE <html>
<head>
<title>My first page</title>
</head>
<body bgcolor="yellow">
<h1>Hello, World.</h1>
<br>
<div align="center">This is my first homepage. </div>
</body>
</html>
|
И вот перед нами уже совсем другая картина... за счёт того, что мы внесли в тег тела параметр "bgcolor" и предали ему значение "yellow" мы изменили задний фон всего отображаемого тела документа на жёлтый. А зашёт тега "<h1>" мы увеличили размер текста, заключонного между этими тегами. Далее мы поставили уже знакомый нам тег "<br>", который перенёс вторую часть нашего приветствия на другу строку. А зашёт тега "align" мы расположили вторую часть приветствия посередине. Вы спросите : "А зачем же тогда нам 'div' ?". Это просто... "align" сам по себе не является тегом, а лишь его параметром... a "div" является, так сказать свободным тегом, если вам нужно, как в данном примере вдруг изменить положение текста.
На этом я закончу наш ввод в этот удивительный язый, дающий нам возможность откывать страницу за страницей и наслаждаться не кучей текстов, а красиво расположенными и красачными страницами.
Если вас заинтересовал этот язык, если вам что-то было не понятно, если у вас возникли вопросы и вы хотите научиться этому языку, то этот раздел для вас. Не стесняйтесь и создаваите топик с интересующими вам вопросами, но не забываите придерживаться общих правил форума и правил раздела в отдельности !
