Головна  Web-програмування - HTML А що таке HTML?
|
| А що таке HTML? |
| Написав Dzo | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Четвер, 23 червня 2011 23:26 Переглядів: 23437
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Вступна лекція HTML (HyperText Markup Language) - це мова розмітки гіпертексту (детально про гіпертекс можна прочитати на вікіпедії). HTML - це не мова програмування. Це форма збереження даних. Чим відрізняється мова програмування від мови розмітки? Глобально - мова програмування програмує дещо на виконання деяких дій, а мова розмітки готує певним чином деякий документ для того, щоб абияка програма могла його використовувати. Розмітка - лишень розмітка і тільки розмітка - ніякого програмування! Таким чином, створивши HTML-документ, ви передаєте його програмі (здебільше, HTML-документи використовуються для створення веб-сайтів, отже, зазвичай, програма для обробки HTML-документа є браузер (browser - переглядач з англійської)), що обробляє його згідно правил, що в неї запрограмовані. Отже, коли браузер “читає” HTML-документ, то він малює на екрані його вміст, керуючись правилами, що в нього закладені для показу файлів, що розмічені мовою HTML. Певне, трошки заплутано, але це краще, ніж “програмувати” на HTML. Отже, розглянемо детально. Уявімо, що ми браузер. З цього і почнеться початок. Відкриваємо хвайл “абиназва.html”, за розширенням розуміємо, що це документ HTML. Далі починаємо читати його. Він, наприклад, містить у собі наступне (жирними текст виділений лише для очевидності): код номер 1: <html> <uf-uf style=”font:bold 20px Verdana”>Uf-Uf</uf-uf> </body> </html>
Ми знаємо, що інформація має знаходиться між “тегами”, тобто спеціальний означеннями, котрі кажуть нам, як саме обробляти те чи інше. Тег - це слово, що взято в фігурні дужки , наприклад . Теги бувають “двох видів”, - що відкривають, та що закривають. Отже, контейнер HTML відкривається тегом та закривається тегом . А все, що поза ними - до контейнеру HTML ніяк не відносяться. Тег що відкриває, має форму , а тег, що закриває . HTML Перший контейнер, що ми зустріли - контейнер html, що каже нам, що вся інформація, що в ньому міститься (між та ), є розміткою HTML. HEAD Йдемо далі. А далі контейнер head (англ. голова), що каже нам, що все, що в цьому контейнері - є службовою інформацію. Службова інформація не виводиться на екран, вона може містити посилання на файли скриптів або стилів, мета-теги та іншу лабуду. TITLE В контейнері head ми зчитуємо контейнер title (англ. заголовок), - це заголовок нашої сторінки, тобто те, що буде написано в назві вкладки на браузері. Head закривася тегом , йдемо далі. BODY Входимо в контейнер body (англ. тіло) - контейнер, що містить інформацію для виводу на сторінку. Все (ну, майже все), що міститься в ньому ми побачимо, переглядаючи HTML-сторінку. P В контейнері body першим йде контейнер p - скорочено від paragraph. Це нам каже, що інформацію всередині цього контейнера треба розмістити за правилами розміщення таких контейнерів, котрі в нас запрограмовані. Зазвичай, параграф має певні відступи згори та знизу і все. UF-UF А от далі цікаво. Тепер ми читаємо контейнер, назва якого в нас не запрограмована. Ми й гадки не маємо, що з ним робити. Це форматування тексту? Скрипт? Стиль? Невідомо. А ще в ньому стиль прописаний style=”font:bold 20px Verdana” . Може, показати просто текст з форматуванням? Чи нічого не показувати? Тут вже залежить від того, який ми браузер. Наприклад, сучасні браузери(Internet Explorer лише 9-ий) покажуть нам текст із форматуванням font:bold 20px Verdana (жирний шрифт Verdana розміру 20 пікселів). Але старі браузери покажуть лише текст, ігноруючи все інше. Тому, поки що краще не зловживати своїми власними тегами, проте, це може комусь і знадобитися. Але це вже тема не ця. Зауважте на майбутнє, що робота зі власними тегами має бути дуже обережною, адже треба враховувати багато різних моментів, що можуть виникнути. На завершення На завершення статті, ми створимо HTML-файл та відкриємо його у браузері. Отже, створіть десь на вашому комп'ютері хвайл з назвою index (це поширена назва початкової сторінки, безліч серверів налаштовуються саме так, тобто, коли ви зайдете на сайт, першим відкриється файл із такою назвою. Але все це налаштовується-переналаштовується, але ці знання вже не входять в пакет HTML). Вкажіть розширення хвайлу html (розширення на Вікіпедії). До речі, ви можете використовувати розширення htm, проте воно вважається застарілим та нерекомендованим. !! Для тих, хто намагається створити файл index.html через Windows Explorer, а виходить якась текстова кака. У Windows Explorer стандартно стоїть опція приховання розришення хвайлу, отже, якщо ви обрали(як то роблять багато хто і я(проте, я рідко створюю хвайли через Windows Explorer)) у меню створення хвайлу текстовий документ, а потім просто назвали його index.html, то розширення все рівно залишилося txt. Отже, для шоб змінити це, необхідно піти до налаштування вигляду папки (керівництво на мікросохті). Після цього необхідно відкрити цей наш хвайл через якийсь текстовий редактор (саме редактор, не текстовий процесор на зразок Microsoft Word або Openoffice.org). Після цього просто скопіюйте код, що я привів раніше (що підписаний код номер 1:) ти вставте в ваш новий файл. Після цього збережіть його та відкрийте через браузер. Правою клавішею, відкрити за допомогою - і оберіть ваш браузер. !! Якщо вам важко розуміти, як що відкрити та створити, де взяти браузер та тощо, я можу персонально для вас створити статтю про базові навички, що потрібні для початку вивчення HTML. На цьому вступна лекція з HTML закінчується. Коментуйте, що ясно, що не ясно. !! Зауважте, я звертаю увагу лише на ввічливі коментарі. Най щастить! ( 22 Проголосувало ) Новіші матеріали:
Старіші матеріали:
3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved." |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Гарний сайт, я в програмуванні не шарю,
