Veb-sahifa nima? Bu Hypertext Markup Language (HTML) da yozilgan hujjat boʻlib, uni brauzer yordamida koʻrish mumkin. Veb-sahifaga URL manzilini kiritish orqali kirish mumkin.

Veb-sahifa matn, grafik va boshqa sahifalar va fayllarga giperhavolalardan iborat bo'lishi mumkin.

Veb-sahifani qanday ochish kerak

Veb-sahifani ko'rish uchun brauzer kerak (masalan, Internet Explorer, Edge, Safari, Firefox yoki Chrome). Brauzeringizda yozish orqali veb-sahifani ochishingiz mumkin manzil satri URL. Masalan, “https://www.computerhope.com/esd.htm” deb yozsangiz, ESD Computer Hope sahifasi ochiladi.

Agar siz tashrif buyurmoqchi bo'lgan saytning URL manzilini bilmasangiz, foydalanishingiz mumkin qidiruv tizimi veb-sahifani topish yoki sayt qidiruvidan foydalanish.

Birinchi veb-sahifa qachon yaratilgan?

Birinchi veb-sahifa CERN da Tim Berners-Li tomonidan 1991-yil 6-avgustda yaratilgan. Undan oldin siz http://info.cern.ch/ manzilida birinchi sayt va birinchi veb-sahifaga tashrif buyurishingiz va ko'rishingiz mumkin.

Sayt va veb-sahifa o'rtasidagi farq nima?

Veb-sayt - bu bir nechta veb-sahifalarni o'z ichiga olgan joy. Misol uchun, bizning resursimiz minglab turli xil veb-sahifalarni o'z ichiga olgan sayt, shu jumladan hozir o'qiyotganingiz:

Yuqoridagi URL misolida "url.htm" veb-sahifa bo'lib, u har doim URLning oxirgi qismidir. .htm, .html, .php, .cgi, .pl yoki boshqa fayl kengaytmalari bilan tugamaydigan URL manzillar uchun server sukut boʻyicha index.htm veb-sahifasini yuklaydi. Masalan, kontakt sahifasi URL manzili uchun veb-sahifa yo'q. Bunday holda, standart indeks fayli /contact katalogidan yuklanadi.

Web sahifalar misollar

Biz allaqachon brauzerlar veb-sahifalarni ko'rish uchun ishlatilishini aytib o'tgan edik. Veb-sahifa bir nechta elementlardan, jumladan CSS, tasvirlar va JavaScript-dan iborat. Veb-sahifaning asosiy qismi bilan yaratilgan HTML yordamida. Bu kod inson tomonidan yozilgan HTML muharriri yordamida yoki server tomonidagi skriptlar yordamida yaratilishi mumkin. Odatda, inson tomonidan yaratilgan veb-sahifa .htm yoki .html kengaytmasi bilan tugaydi. Masalan, bu sahifada "webpage.htm" fayl nomi mavjud. Skript tomonidan yaratilgan sahifalar .cgi, .php, .pl va boshqalar bilan tugashi mumkin.

Veb-sahifa qanday elementlardan iborat?

Quyida veb-dizaynerlar veb-sahifaning mantiqiy tuzilishi nima ekanligini tushunishlari uchun asosiy elementlarning taqsimoti keltirilgan:

Sayt nomi, logotipi yoki kompaniya nomi deyarli har doim har bir veb-sahifaning yuqori chap burchagida joylashgan. Shuningdek, shiordan foydalanish yaxshi fikr yoki qisqa Tasvir yangi tashrif buyuruvchilarga sayt haqida tushuncha berish uchun sahifalar. Ushbu veb-sahifa elementi odatda bosh sahifaga olib boradigan havoladir;

Qidiruv paneli tashrif buyuruvchilarga veb-sahifani tezda topish imkonini beradi. U har bir sahifada bo'lishi kerak;

Navigatsiya paneli yoki menyusi odatda har bir veb-sahifaning yuqori yoki chap tomonida joylashgan. U saytning har bir asosiy bo'limiga havolalarni o'z ichiga olishi kerak;

Banner reklamalari veb-sahifaning turli joylarida paydo bo'lishi mumkin. Ular odatda veb-sahifaning yuqori, chap, o'ng yoki pastki qismida ko'rsatiladi yoki asosiy tarkibga kiritiladi;

Ijtimoiy tugmalar tashrif buyuruvchilarga ijtimoiy tarmoq saytlarida veb-sahifaga havolani almashish imkonini beradi;

Yaratilgan veb-sahifalarda non bo'laklari tashrif buyuruvchiga uning qaerdaligini tushunishga yordam beradi, shuningdek, saytning boshqa bo'limlariga o'tadi;

Sarlavha har bir veb-sahifaning yuqori qismida bo'lishi kerak. U HTML tegi yordamida yaratilgan.

Ochilish paragrafi veb-sahifaning eng muhim elementlaridan biridir. Bu tashrif buyuruvchini veb-sahifa mazmunini o'qishga qiziqtirishi kerak. Tashrifchilarning e'tiborini jalb qilishning bir usuli - birinchi xatboshi yoniga rasm qo'yish;

Har bir veb-sahifa pastki darajadagi sarlavhalarga bo'lingan bo'lishi kerak, bu esa tashrif buyuruvchiga tarkibni osongina skanerlashi va sahifada o'zlari uchun eng qiziqarli narsalarni topish imkonini beradi. Web-sahifa yaratishda buni HTML teglari yordamida amalga oshirish mumkin...;

Tashrif buyuruvchilarni shaklga yo‘naltiruvchi havola yoki tugma bilan ta’minlash yaxshi fikr. fikr-mulohaza shuning uchun ular sizga foydali bo'lganligini aytishlari mumkin ushbu veb-sahifa yoki yo'q;

Sahifani chop etish tugmasi kabi qo'shimcha ma'lumotlar va vositalar ham foydalanuvchilar uchun foydali bo'lishi mumkin;

Altbilgi o'z ichiga olishi kerak Qo'shimcha ma'lumot, bu kompaniya yoki sayt uchun muhim. Shuningdek, boshqa veb-sahifalarga havolalar;

Mualliflik huquqi va har qanday qonuniy yoki maxfiy bildirishnoma ham barcha veb-sahifalarda joylashtirilishi kerak. Veb-sahifani loyihalash asoslarida bu element nafaqat tegishli huquqiy ma'lumotlarga havola qilishi mumkin. Bu shuningdek, tashrif buyuruvchilar veb-sahifaning oxiriga yetganligini ko'rsatadi;

"Sahifa tepasi" tugmasi tashrif buyuruvchilarga menyu havolalariga kirish uchun veb-sahifaning yuqori qismiga tezda qaytishga yordam beradi.

Foydalanuvchilar veb-sahifada nima qilishlari mumkin?

Ko'pgina veb-sahifalarda qo'shimcha ma'lumotni topish uchun bosgan qiziqarli giperhavolalar mavjud. Shuningdek, siz musiqa tinglashingiz, video tomosha qilishingiz, xarid qilishingiz, suhbat qilishingiz va boshqa ko'p narsalarni qilishingiz mumkin.

HTML va CSS veb-saytlarini yaratish darslari orqali sayohatimizni boshlashdan oldin, ikki til o'rtasidagi farqlarni, har bir tilning sintaksisini va ba'zi bir asosiy terminologiyani tushunish muhimdir.

HTML va CSS nima?

HTML (HyperText Markup Language) sarlavhalar, paragraflar yoki tasvirlar kabi tarkibni belgilaydigan tarkibning tuzilishini va uning ma'nosini belgilaydi. CSS (Cascading Style Sheets) yoki kaskadli uslublar jadvallari dizayn uchun yaratilgan taqdimot tilidir. ko'rinish kontent, masalan, shriftlar yoki ranglardan foydalangan holda.

Ushbu ikki til - HTML va CSS - bir-biridan mustaqil va shunday bo'lib qolishi kerak. CSS HTML hujjatida yozilmasligi kerak va aksincha. Umumiy qoida sifatida HTML har doim tarkibni ifodalaydi va CSS har doim uslubni belgilaydi.

HTML va CSS o'rtasidagi farqni tushungan holda, keling, HTMLga batafsilroq to'xtalib o'tamiz.

Asosiy HTML shartlari

HTML bilan ishlashni boshlashdan oldin siz yangi va ko'pincha g'alati atamalarga duch kelishingiz mumkin. Vaqt o'tishi bilan siz ularning barchasi bilan ko'proq tanishasiz, ammo hozircha uchta asosiy HTML atamasidan boshlashingiz kerak - elementlar, teglar va atributlar.

Elementlar

Elementlar sahifadagi ob'ektlarning tuzilishi va mazmunini qanday aniqlashni belgilaydi. Ko'p ishlatiladigan elementlardan ba'zilari sarlavhalarning bir nechta darajalarini (dan dan gacha elementlar sifatida belgilanadi) va paragraflarni (sifatida belgilangan) o'z ichiga oladi.

); Ro'yxatga elementlarni kiritishingiz mumkin ... va boshqalar.

Elementlar element nomini o'rab turgan burchakli qavslar bilan aniqlanadi. Shunday qilib, element quyidagicha ko'rinadi:

Teglar

Burchakli qavslarni qo'shish< и >element atrofida teg deb ataladigan narsani yaratadi. Teglar ko'pincha ochilish va yopish teglari juftligida uchraydi.

Ochilish yorlig'i elementning boshlanishini belgilaydi. U belgidan iborat; Masalan, .

Yopuvchi teg elementning oxirini belgilaydi. U belgidan iborat< с последующей косой чертой и именем элемента и завершается символом >; Masalan, .

Ochilish va yopish teglari o'rtasida paydo bo'ladigan tarkib ushbu elementning mazmunidir. Masalan, havolada ochilish yorlig'i bo'ladi va yopish yorlig'i. Ushbu ikkita teg o'rtasida bo'lgan narsa havolaning mazmuni bo'ladi.

Shunday qilib, havola teglari quyidagicha ko'rinadi:

...

Atributlar

Atributlar - bu element haqida qo'shimcha ma'lumot berish uchun ishlatiladigan xususiyatlar. Eng keng tarqalgan atributlarga elementni aniqlaydigan id atributi kiradi; elementni tasniflaydigan sinf atributi; o'rnatilgan tarkibning manbasini ko'rsatadigan src atributi; va bog'langan manbaga havolani belgilaydigan href atributi.

Atributlar element nomidan keyin ochilish tegida aniqlanadi. Umuman olganda, atributlar nom va qiymatni o'z ichiga oladi. Ushbu atributlar formati atribut nomidan keyin tenglik belgisidan va qo'shtirnoq ichidagi atribut qiymatidan iborat. Masalan, element href atributi bilan quyidagicha ko'rinadi:

Shay Xou

Asosiy HTML atamalarini ko'rsatish

Ushbu kod veb-sahifada "Shay Howe" matnini ko'rsatadi va ushbu matn bosilganda foydalanuvchi http://shayhowe.com saytiga olib boradi. Bog'lanish elementi ochilish tegi yordamida e'lon qilinadi va yopish yorlig'i matnni qamrab olgan, shuningdek, ochilish tegida href="http://shayhowe.com" orqali e'lon qilingan havola manzilining atributi va qiymati.

Guruch. 1.01. Kontur shaklida HTML sintaksisi element, atribut va tegni o'z ichiga oladi

HTML elementlari, teglari va atributlari nima ekanligini bilganingizdan so'ng, keling, birinchi veb-sahifamizni ko'rib chiqamiz. Agar biror narsa bu yerda yangi bo‘lib ko‘rinsa, xavotir olmang – biz uni yo‘l-yo‘lakay ajratamiz.

HTML hujjat strukturasini moslashtirish

HTML hujjatlari .txt emas, balki .html kengaytmasi bilan saqlanadigan oddiy matnli hujjatlardir. HTML yozishni boshlash uchun avvalo sizga qulay bo'lgan matn muharriri kerak. Afsuski, bu o'z ichiga olmaydi Microsoft Word yoki Sahifalar, chunki ular murakkab tahrirlovchilardir. HTML va CSS yozish uchun ikkita eng mashhur matn muharrirlari Dreamweaver va Ajoyib matn. Bepul alternativlar Windows uchun Notepad++ va Mac uchun TextWranglerni ham o'z ichiga oladi.

Barcha HTML hujjatlarida quyidagi deklaratsiyalar va elementlarni o'z ichiga olgan talab qilinadigan tuzilma mavjud: , , va .

Hujjat turi deklaratsiyasi yoki HTML hujjatining boshida joylashgan bo'lib, brauzerlarga HTMLning qaysi versiyasidan foydalanilayotganligini bildiradi. Biz HTMLning eng so'nggi versiyasidan foydalanayotganimiz sababli, hujjat turi oddiy bo'ladi. Shundan so'ng hujjatning boshlanishini ko'rsatadigan element keladi.

Ichkarida element belgilaydi yuqori qismi hujjat, shu jumladan turli metama'lumotlar (sahifa haqidagi qo'shimcha ma'lumotlar). Element ichidagi tarkib veb-sahifaning o'zida ko'rsatilmaydi. Buning o'rniga, u hujjatning sarlavhasini (brauzer oynasining sarlavha satrida paydo bo'ladi), har qanday tashqi fayllarga havolalarni yoki boshqa foydali metama'lumotlarni o'z ichiga olishi mumkin.

Veb-sahifaning barcha ko'rinadigan tarkibi elementda bo'ladi. Oddiy HTML hujjatining tuzilishi quyidagicha ko'rinadi:

Salom Dunyo! Salom Dunyo!

Bu veb-sahifa.

HTML hujjat tuzilishini ko'rsatish

Ushbu kod hujjat turi deklaratsiyasidan boshlab hujjatni ko'rsatadi, so'ngra darhol . Ichkarida elementlar va mavjud. Element teg orqali sahifa kodlashini va element orqali hujjat sarlavhasini o'z ichiga oladi. Element element orqali sarlavha va matn paragrafini o'z ichiga oladi. Sarlavha ham, paragraf ham element ichiga joylashtirilganligi sababli ular veb-sahifada ko'rinadi.

Element boshqa element ichida bo'lsa, shuningdek, ichki ichki deb ham ataladi, hujjat tuzilishini yaxshi tashkil etilgan va o'qilishi mumkin bo'lishi uchun uni cheklash yaxshi bo'ladi. Oldingi kodda ikkala element ham ichkariga joylashtirilgan va . Elementlar uchun chekinish tuzilishi va ichiga qo'shilgan yangi elementlar bilan davom etadi.

O'z-o'zidan yopiladigan elementlar

Oldingi misolda element yopish tegini o'z ichiga olmagan yagona teg edi. Xavotir olmang, bu ataylab qilingan. Hamma elementlar ochilish va yopish teglaridan iborat emas. Ba'zi elementlar faqat bitta teg ichidagi atributlar orqali tarkib yoki xatti-harakatlarni qabul qiladi. ana shu elementlardan biridir. Misoldagi elementning mazmuni charset atributi va qiymat yordamida tayinlanadi. Boshqa tipik o'z-o'zidan yopiladigan elementlarga quyidagilar kiradi:

• 
  

Hujjat turi deklaratsiyasi va , va elementlari yordamida tuzilgan quyidagi tuzilma juda keng tarqalgan. Biz ushbu hujjat strukturasini qulay saqlashni xohlaymiz, chunki biz yangi HTML hujjatlarini yaratishda undan tez-tez foydalanamiz.

Kodni tekshirish

Kodimizni qanchalik ehtiyotkorlik bilan yozmasak ham, xatolar muqarrar. Yaxshiyamki, HTML va CSS yozishda bizda ishimizni tekshirish uchun validatorlar mavjud. W3C kodni xatolar uchun skanerlaydigan HTML va CSS tekshiruvchilarini taklif qiladi. Kodimizni ko'rib chiqish nafaqat uni barcha brauzerlarda to'g'ri ko'rsatishga yordam beradi, balki kod yozishda eng yaxshi amaliyotlarni o'rgatishda ham yordam beradi.

Amalda

Veb-dizaynerlar va ishlab chiquvchilar sifatida biz hunarmandchiligimizga bag'ishlangan bir qator ajoyib konferentsiyalarda qatnashish hashamatiga egamiz. Biz o'zimizning uslublar konferentsiyasini tashkil qilamiz va keyingi darslar davomida uning veb-saytini yaratamiz. Mana bunday!

Keling, HTML-dan biroz uzoqroqda viteslarni almashtiramiz va CSS-ni ko'rib chiqamiz. Esda tutingki, HTML veb-sahifalarimizning mazmuni va tuzilishini belgilaydi, CSS esa ularning vizual uslubi va ko'rinishini belgilaydi.

Asosiy CSS shartlari

HTML shartlariga qo'shimcha ravishda siz tanishishingiz kerak bo'lgan ba'zi asosiy CSS atamalari mavjud. Bu atamalar selektorlar, xususiyatlar va qiymatlarni o'z ichiga oladi. Xuddi HTML terminologiyasida bo'lgani kabi, siz CSS bilan qanchalik ko'p ishlasangiz, bu atamalar shunchalik ikkinchi tabiatga aylanadi.

Selektorlar

Veb-sahifaga elementlar qo'shganda, ular bilan uslublash mumkin CSS yordamida. Selektor HTML-dagi qaysi element yoki elementlarga maqsad va uslublarni (masalan, rang, o'lcham va joylashuv) qo'llashni aniqlaydi. Selektorlar biz qanchalik aniq bo'lishni xohlayotganimizga qarab, noyob elementlarni tanlash uchun turli ko'rsatkichlar kombinatsiyasini o'z ichiga olishi mumkin. Misol uchun, biz sahifadagi har bir paragrafni tanlashni yoki faqat bitta aniq paragrafni tanlashni xohlaymiz.

Selektorlar odatda id yoki sinf qiymati yoki yoki kabi element nomi kabi atribut qiymati bilan bog'lanadi.

CSS-da selektorlar tanlangan elementga qo'llaniladigan uslublarni qamrab oluvchi jingalak qavslar () bilan birlashtirilgan. Ushbu selektor barcha elementlarga mo'ljallangan

P(...)

Xususiyatlari

Element tanlanganidan so'ng, xususiyat unga qo'llaniladigan uslublarni belgilaydi. Xususiyat nomlari selektordan keyin, jingalak qavs ichida () va ikki nuqtadan oldin keladi. Biz foydalanishimiz mumkin bo'lgan ko'plab xususiyatlar mavjud, masalan, fon, rang, shrift o'lchami, balandlik va kenglik va boshqa keng tarqalgan qo'shilgan xususiyatlar. Quyidagi kodda biz barcha elementlarga tegishli rang va shrift o'lchami xususiyatlarini aniqlaymiz

P (rang: ...; shrift o'lchami: ...; )

Qiymatlar

Hozircha biz faqat selektor orqali elementni tanladik va xossalar orqali unga qaysi uslubni qo'llashimizni aniqladik. Endi biz ushbu xususiyatning harakatini qiymat orqali o'rnatishimiz mumkin. Qiymatlar ikki nuqta va nuqtali vergul orasidagi matn sifatida belgilanishi mumkin. Quyida biz barcha elementlarni tanlaymiz

Va rang xususiyati qiymatini to'q sariq rangga va shrift o'lchami xususiyati qiymatini 16 pikselga o'rnating.

P (rang: to'q sariq; shrift o'lchami: 16px; )

Buni sinab ko'rish uchun, CSS-da bizning qoidalar to'plami selektordan boshlanadi va darhol jingalak qavslar bilan boshlanadi. Bu jingalak qavslar xossalar va qiymatlar juftligidan iborat deklaratsiyalarni o'z ichiga oladi. Har bir deklaratsiya mulkdan boshlanadi, undan keyin ikki nuqta, mulk qiymati va nihoyat nuqta-vergul qo'yiladi.

Keng tarqalgan amaliyot - bu jingalak qavslar ichidagi xususiyatlar va qiymatlarni o'zgartirish. HTML-da bo'lgani kabi, chekinish bizning kodimizni tartibli va aniq saqlashga yordam beradi.

Guruch. 1.03. CSS sintaksisi tarkibiga selektor, xususiyatlar va qiymatlar kiradi

Bir nechta asosiy atamalarni va umumiy CSS sintaksisini bilish ajoyib boshlanishdir, ammo biz chuqurlikka sho'ng'ishdan oldin yana bir nechta fikrlarni ko'rib chiqishimiz kerak. Xususan, biz CSS-da selektorlar qanday ishlashini batafsil ko'rib chiqishimiz kerak.

Selektorlar bilan ishlash

Yuqorida aytib o'tilganidek, selektorlar qaysi HTML elementlari uslublanishini ko'rsatadi. Selektorlardan qanday foydalanishni va ular qanday ishlashini to'liq tushunish muhimdir. Birinchi qadam tanishish bo'lishi kerak har xil turlari selektorlar. Biz eng asosiy selektorlardan boshlaymiz: tur, sinf va identifikator selektorlari.

Tur selektorlari

Tur selektorlari elementlarni turiga qarab belgilaydi. Misol uchun, agar biz barcha elementlarni maqsad qilib qo'ymoqchi bo'lsak, div selektoridan foydalanishimiz kerak. Quyidagi kod elementlar uchun tur selektorini, shuningdek, tegishli HTMLni ko'rsatadi.

Div(...)

... ...

Sinflar

Sinflar sinf atributining qiymatiga qarab elementni tanlash imkonini beradi. Sinf selektorlari tur tanlagichlariga qaraganda bir oz aniqroqdir, chunki ular bir xil turdagi barcha elementlarni emas, balki muayyan elementlar guruhini tanlaydi.

Sinflar bir nechta elementlar uchun bir xil sinf atribut qiymatidan foydalangan holda bir vaqtning o'zida turli xil elementlarga bir xil uslublarni qo'llash imkonini beradi.

CSS-da sinflar sinf atributining qiymatidan keyin bosh nuqta bilan ifodalanadi. Quyida sinf selektori ajoyib sinf atributining qiymatini o'z ichiga olgan barcha elementlarni, jumladan va elementlarni tanlaydi

Ajoyib(...)

...

Identifikatorlar

Identifikatorlar sinflardan ham aniqroqdir, chunki ular bir vaqtning o'zida faqat bitta noyob elementni nishonga oladi. Sinf selektorlari sinf atributining qiymatidan foydalanganidek, identifikatorlar selektor sifatida id atributining qiymatidan foydalanadilar.

Ko'rsatilgan element turidan qat'i nazar, id atribut qiymati sahifada faqat bir marta ishlatilishi mumkin. Agar identifikatorlar mavjud bo'lsa, ular muhim elementlar uchun ajratilishi kerak.

CSS-da identifikatorlar oldida xesh belgisi, keyin esa id atributining qiymati bilan ifodalanadi. Bu erda identifikator faqat shayhowe qiymatiga ega id atributini o'z ichiga olgan elementni tanlaydi.

#shayhowe ( ... )

...

Qo'shimcha selektorlar

Selektorlar juda kuchli narsalar va yuqorida tavsiflanganlar biz duch keladigan eng keng tarqalgan selektorlar qatoriga kiradi. Bu tanlovchilar faqat boshlanishi. Ko'plab ilg'or selektorlar mavjud va ular osongina mavjud. Ular bilan qulay bo'lganingizdan so'ng, ba'zi ilg'orlarini tekshirishdan qo'rqmang.

OK, keling, hamma narsani birlashtirishni boshlaylik. Biz HTML ichidagi sahifaga elementlarni qo'shamiz, so'ngra ushbu elementlarni tanlashimiz va CSS-dan foydalanib ularni uslublashimiz mumkin. Keling, ikkita tilni birgalikda ishlashi uchun HTML va CSS o'rtasidagi nuqtalarni bog'laymiz.

CSS ulanish

Bizning CSS-ni HTML bilan gaplashish uchun biz HTML-dan CSS fayliga ishora qilishimiz kerak. Yaxshi amaliyot bizning barcha uslublarimizni HTML hujjatimiz elementi ichida ko'rsatilgan bitta tashqi faylga kiritishdir. Bitta tashqi CSS-dan foydalanish bizga sayt bo'ylab bir xil uslublarni qo'llash va unga tezda o'zgartirishlar kiritish imkonini beradi.

CSS qo'shishning boshqa variantlari

CSS-ni qo'shishning boshqa variantlari ichki va ichki uslublardan foydalanishni o'z ichiga oladi. Siz haqiqatda bu variantlarga duch kelishingiz mumkin, lekin ular odatda rad etiladi, chunki ular saytlarni yangilashni mashaqqatli va mashaqqatli qiladi.

Tashqi uslublar jadvalimizni yaratish uchun biz tanlagan matn muharriridan yangisini yaratish uchun yana foydalanmoqchimiz matn fayli.css kengaytmasi bilan. Bizning CSS faylimiz HTML faylimiz bilan bir xil papkada yoki pastki papkada saqlanishi kerak.

Elementning ichida HTML va CSS fayllari o'rtasidagi munosabatni belgilaydigan element ishlatiladi. Biz CSS-ga ulanayotganimiz sababli, ularning munosabatlarini ko'rsatish uchun uslublar jadvali qiymati bilan rel atributidan foydalanamiz. Bundan tashqari, href atributi CSS faylining joylashuvi yoki yo'lini ko'rsatish uchun ishlatiladi.

Quyidagi misolda HTML hujjatida element tashqi uslublar jadvaliga ishora qiladi.

CSS to'g'ri ko'rsatilishi uchun href atributining yo'l qiymati CSS fayli saqlangan joyga to'g'ridan-to'g'ri mos kelishi kerak. Oldingi misolda main.css fayli ildiz papkasi sifatida ham tanilgan HTML fayli bilan bir joyda saqlanadi.

Agar CSS fayli pastki papkada joylashgan bo'lsa, href atributining qiymati mos ravishda shu yo'lga mos kelishi kerak. Misol uchun, agar bizning main.css faylimiz uslublar jadvallari nomli pastki jildda saqlangan bo'lsa, href atributining qiymati stylesheets/main.css bo'ladi. Bu pastki jildga o'tishni ko'rsatish uchun oldinga chiziq (yoki slash) dan foydalanadi.

Yoniq bu daqiqa sahifalarimiz asta-sekin, lekin ishonch bilan jonlana boshlaydi. Biz hali CSS-ni chuqur o'rganmadik, lekin siz ba'zi elementlarning biz CSS-da e'lon qilmagan uslublarga ega ekanligini payqadingiz. Aynan brauzer ushbu elementlarga o'ziga xos uslublarni qo'yadi. Yaxshiyamki, biz ushbu uslublarni juda oson qayta yozishimiz mumkin, bu esa CSS-ni qayta o'rnatish orqali amalga oshiriladi.

CSS-ni tiklashdan foydalanish

Har bir brauzer turli elementlar uchun o'zining standart uslublariga ega. Qanaqasiga Gugl xrom sarlavhalar, paragraflar, ro'yxatlar va hokazolarni ko'rsatadi, Internet Explorer buni amalga oshirish usulidan farq qilishi mumkin. Brauzerlar o'rtasidagi muvofiqlikni ta'minlash uchun CSS-ni qayta tiklash keng qo'llanila boshlandi.

CSS-ni tiklash barcha asosiy HTML elementlarini ma'lum uslubga ega bo'ladi va barcha brauzerlarda izchil uslubni ta'minlaydi. Ushbu qayta o'rnatishlar odatda o'lchamlarni, to'ldirishni, chekkalarni yoki ushbu qiymatlarni pasaytiradigan qo'shimcha uslublarni olib tashlashni o'z ichiga oladi. CSS kaskadi yuqoridan pastgacha ishlaganligi sababli (bu haqda tez orada bilib olasiz) - bizning qayta o'rnatishimiz uslubimizning eng yuqori qismida bo'lishi kerak. Bu ushbu uslublar birinchi navbatda o'qilishini ta'minlaydi va tamom. turli xil brauzerlar umumiy tayanch nuqtasidan ishlay boshlaydi.

Qo'llash mumkin bo'lgan turli xil CSS sozlamalari mavjud, ularning barchasi o'ziga xos xususiyatlarga ega kuchli tomonlari. Erik Meyerning eng mashhurlaridan biri bo'lib, uning CSS sozlamalari yangi HTML5 elementlarini kiritish uchun moslashtirilgan.

Agar o'zingizni biroz sarguzashtli his qilsangiz, Nikolas Gallager tomonidan yaratilgan Normalize.css ham mavjud. Normalize.css barcha asosiy elementlar uchun qattiq resetdan foydalanishga e'tibor bermaydi, balki bu elementlar uchun umumiy uslublarni o'rnatishga e'tibor beradi. Bu CSS-ni chuqurroq tushunishni, shuningdek, uslublardan nimaga erishmoqchi ekanligingizni bilishni talab qiladi.

Brauzerlar o'rtasidagi muvofiqlik va sinov

Yuqorida aytib o'tilganidek, turli brauzerlar elementlarni boshqacha ko'rsatadilar. Brauzerlar o'rtasidagi muvofiqlik va sinovning muhimligini tan olish muhimdir. Saytlar barcha brauzerlarda bir xil ko'rinmasligi kerak, lekin ular yaqin bo'lishi kerak. Qaysi brauzerlarni qo'llab-quvvatlamoqchisiz va qay darajada saytingiz uchun eng yaxshisi bo'lgan qarorga asoslanib qaror qabul qilishingiz kerak bo'ladi.

CSS yozishda bir nechta narsalarga e'tibor berish kerak. Yaxshi xabar shundaki, siz hamma narsani qila olasiz va uni o'zlashtirish uchun ozgina sabr kerak.

Amalda

Keling, konferentsiya saytida oxirgi marta to'xtagan joyga qaytaylik va qanday qilib CSS qo'shishimiz mumkinligini ko'rib chiqaylik.

Uslublar-konferentsiya papkasida keling, aktivlar deb nomlangan yangi papka yarataylik. Uslublar, tasvirlar, videolar va boshqalar kabi veb-saytimiz uchun barcha resurslarni shu yerda saqlaymiz. Uslublarimiz uchun keling, aktivlar jildiga boshqa uslublar jadvallari papkasini qo'shamiz.

Matn muharriridan foydalanib, main.css nomli yangi fayl yaratamiz va uni biz yaratgan uslublar jadvallari papkasida saqlaylik.

Brauzerda index.html faylini ko'rib, elementlar va

Birlamchi uslub allaqachon mavjud. Xususan, ular o'ziga xos shrift o'lchamiga va atrofida bo'sh joyga ega. Erik Meyerning qayta o'rnatishidan foydalanib, biz ushbu uslublarni yumshata olamiz, bu ularning har biriga bir xil asosdan boshlash imkonini beradi. Buning uchun uning veb-saytini ko'rib chiqing, kodni nusxalang va uni main.css faylimizning yuqori qismiga qo'ying.

/* http://meyerweb.com/eric/tools/css/reset/ 2. v2.0 | 20110126 Litsenziya: hech biri (jamoat mulki) */ html, tana, div, span, applet, obyekt, iframe, h1, h2, h3, h4, h5, h6, p, blok tirnoq, pre, a, abbr, qisqartma, manzil, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, maydon toʻplami, shakl, yorliq, afsona, jadval, sarlavha, tbody, tfoot, thead, tr, th, td, maqola, chetga, tuval, tafsilotlar, oʻrnatish, rasm, figcaption, altbilgi, sarlavha, hgroup, menyu, nav, chiqish, ruby, bo'lim, xulosa, vaqt, belgi, audio, video (chekka: 0; to'ldirish: 0; chegara: 0; shrift o'lchami: 100%; shrift: meros; vertikal tekislash: asosiy chiziq ; ) /* Eski brauzerlar uchun HTML5 displey rolini tiklash */ maqola, chetga, tafsilotlar, rasm, rasm, altbilgi, sarlavha, hgroup, menyu, nav, bo‘lim (displey: blok; ) tana (satr balandligi: 1; ) ol, ul ( roʻyxat uslubi: yoʻq; ) blok iqtibos, q ( qoʻshtirnoq: yoʻq; ) blokquote:oldin, blok qoʻshtirnoq:keyin, q:oldin, q:keyin (kontent: ""; tarkib: yoʻq; ) jadval ( chegara- yiqilish: yiqilish; chegara oralig'i: 0; )

Bizning main.css faylimiz shakllana boshladi, shuning uchun uni index.html fayliga ulaymiz. index.html faylini oching matn muharriri va elementni elementdan keyin ga qo'shing.

Biz element orqali uslublarga ishora qilayotganimiz uchun qiymatlar jadvali bilan rel atributini qo'shing.

Shuningdek, biz href atributidan foydalangan holda main.css faylimizga havolani kiritamiz. Esda tutingki, bizning main.css faylimiz aktivlar papkasida joylashgan uslublar jadvallari papkasida saqlanadi. Shunday qilib, bizning main.css faylimizga yo'l bo'lgan href atributining qiymati assets/stylesheets/main.css bo'lishi kerak.

Uslublar konferentsiyasi

Bizning ishimizni tekshirish va HTML va CSS-ning birgalikda ishlashini ko'rish vaqti keldi. Brauzerda index.html faylini ochish (yoki u allaqachon ochiq bo'lsa, sahifani yangilash) avvalgidan biroz boshqacha natijani ko'rsatishi kerak.

Guruch. 1.04. CSS-ni qayta o'rnatgan uslublar konferentsiyasi saytimiz

Demo va manba kodi

Quyida siz Styles Conference veb-saytini hozirgi holatida ko'rishingiz, shuningdek, saytning joriy manba kodini yuklab olishingiz mumkin.

Xulosa

Demak, hammasi yaxshi! Ushbu qo'llanmada biz katta qadamlar qo'ydik.

O'ylab ko'ring, endi siz HTML va CSS asoslarini bilasiz. Biz davom etar ekanmiz va siz HTML va CSS yozishga ko'proq vaqt sarflasangiz, ushbu ikki til bilan ishlash ancha qulay bo'ladi.

Xulosa qilish uchun biz quyidagilarni ko'rib chiqdik:

• HTML va CSS o'rtasidagi farq.
• HTML elementlari, teglari va atributlari bilan tanishish.
• Birinchi veb-sahifangizning tuzilishini sozlash.
• CSS selektorlari, xususiyatlari va qiymatlari bilan tanishish.
• CSS selektorlari bilan ishlash.
• HTML-dan CSS-ga ko'rsatgich.
• CSS-ni qayta tiklashning ahamiyati.

Endi HTMLni batafsil ko'rib chiqamiz va semantika bilan bir oz tanishamiz.

Resurslar va havolalar

• Scripting Master orqali umumiy HTML atamalari
• Ta'sirchan veb-saytlar orqali CSS shartlari va ta'riflari
• CSS vositalari: Erik Meyer orqali CSS-ni tiklash

Ishning maqsadi: talabalarni HTML tilining asosiy tushunchalari, HTML hujjatining tuzilishi, majburiy teglar, izohlar, matnni formatlash usullari, fizik va mantiqiy uslublar bilan tanishtirish hamda oddiy statik Web-hujjatlarni yaratish malakalarini egallash.

Laboratoriya darslarida HTML fayllarni tayyorlash uchun Notepad matn muharriridan, bajarilgan ishlarni kuzatish uchun esa Internet Explorer brauzeridan foydalanamiz.

Nazariy ma'lumotlar

Asosiy tushunchalar

Gipermatn- kompyuter ekranidagi matn elementlari o‘rtasida semantik bog‘lanishlarni bir elementdan ikkinchisiga oson o‘tish mumkin bo‘lgan tarzda o‘rnatish imkonini beruvchi axborot strukturasi. Amalda gipermatnda ayrim so‘zlar tagiga chizish yoki boshqa rangda bo‘yash (giperhavolalar) orqali ajratib ko‘rsatiladi. So'zni ajratib ko'rsatish ushbu so'z va ajratilgan so'z bilan bog'liq mavzu batafsilroq muhokama qilinadigan ba'zi hujjat o'rtasidagi bog'liqlikni bildiradi. HTML formatida yozilgan alohida hujjat deyiladi:

HTML hujjati;

Veb-hujjat;

Veb sahifa.

Bunday sahifalar odatda NTM yoki HTML formatida bo'ladi.

Bitta muallifga yoki bitta IEDV tanasiga tegishli bo'lgan va umumiy giperhavolalar bilan o'zaro bog'langan veb-sahifalar guruhi veb-tugun yoki veb-sayt deb ataladigan tuzilmani hosil qiladi. Har bir HTML sahifasining o'ziga xos URL manzili bor - adpec Internetda.

ramka (Ramka) - ikki ma'noga ega bo'lgan atama. Birinchi qiymat - bu o'z aylantirish satrlari bo'lgan hujjat maydoni. Ikkinchisi jonlantirilgan grafik fayldagi (ramka) 0DNN0H tasviridir.

applet (Applet) - shaklda mijoz kompyuteriga uzatiladigan dastur alohida fayl va veb-sahifani ko'rishda ishga tushiriladi.

skript (Skript) , yoki skript - bu veb-sahifaning imkoniyatlarini kengaytirish uchun kiritilgan dastur. Muayyan holatlarda Internet Explorer brauzeri quyidagi xabarni ko'rsatadi: "Sahifada skriptni bajarishga ruxsat berilsinmi?" Bu holda biz skriptlarni nazarda tutamiz.

CGI (Umumiy Gateway Interfeys) - serverda ishlovchi Web-sahifalar imkoniyatlarini kengaytirish imkonini beruvchi dasturlarning umumiy nomi. Bunday dasturlarsiz interaktiv Web-sahifalarni yaratish mumkin emas.

Brauzer (Brauzer) - Web sahifalarni ko'rish dasturi.

Element- HTML tilini loyihalash. Siz uni ma'lumotlarni saqlaydigan va ma'lum bir shaklda formatlash imkonini beruvchi konteyner sifatida tasavvur qilishingiz mumkin. Har qanday Web-sahifa elementlar to'plamidir. Gipermatnning asosiy g'oyalaridan biri - elementlarni joylashtirish imkoniyatidir. Masalan:

Elementning mazmuni, element formatlaydigan ma'lumotlar

teg(inglizcha teg - label, deskriptor, label) - elementning boshlanish yoki tugatish belgisi. Teglar elementlarning harakat chegaralarini belgilaydi va elementlarni bir-biridan ajratib turadi. Web-sahifa matnida teglar burchakli qavslar ichiga olinadi< >, va yakuniy tegdan keyin har doim qiya chiziq qo'yiladi. Matn bu qavslar orasida emas (< >), brauzerda ko'rilganda to'liq ko'rinadi. Masalan:

Elementning mazmuni, ma'lumotlar

elementni formatlaydi

Ushbu matn alohida paragrafda joylashgan bo'ladi

Har qanday Web-sahifa elementlar to'plamidir. HTML ning asosiy tamoyillaridan biri bu bir elementni boshqasiga joylashtirish qobiliyatidir.

Xususiyat- elementning parametri yoki xususiyati. Atributlar boshlang'ich teg ichida joylashgan va bir-biridan bo'sh joylar bilan ajratilgan. Agar tsement matnni o'z ichiga olsa, atributlar shrift rangi va o'lchamini, matn paragrafini tekislashni va hokazolarni belgilashi mumkin. Agar element rasmni o'z ichiga olgan bo'lsa, u holda atributlar rasmning o'lchamini, rasm atrofidagi ramkaning mavjudligi va hajmini va hokazolarni belgilashi mumkin.

Ushbu matn ekranning o'rtasiga tekislanadi

Ushbu misolda yana paragrafning boshi va oxirini belgilaydigan teg ishlatiladi. Shu bilan birga, boshlang'ich tegda align atributi mavjud bo'lib, u matnni ekranning o'rtasiga moslashtirishni o'rnatadi.

Eslatma:

Har qanday foydali ma'lumotlar uning formatini ko'rsatuvchi boshlang'ich va tugatish teglari orasida bo'lishi kerak;

Barcha atributlar start tegida joylashgan;

Foydalanish qulayligi uchun siz boshlang'ich tegni katta (katta) harf (P) bilan va oxirgi tegni kichik (kichik) harf (/p) bilan yozishingiz mumkin, ammo bu shart emas;

Hamma elementlar tugatish (yopish) tegini talab qilmaydi;

Har bir yangi elementni yozishni boshlang yangi qator. Ichki elementlarni chekinish (tab). Bu yana kerak emas, lekin bu sizning ishingizni ancha osonlashtiradi.

WWW dan biron-bir hujjatni yuklab olganingizda, uning brauzer oynasidagi matni mukammal formatlangan, ko'rish uchun qulay shaklda ko'rsatiladi. Bu shuni anglatadiki, WEB-sahifalar oddiy matn emas, balki brauzer oynasida hujjat taqdimotini boshqarish uchun ba'zi yordamchi ma'lumotlarni o'z ichiga oladi. Hujjatni ishlab chiqishda foydalanuvchi uni qaysi turdagi kompyuterda ko'rishi aniq bo'lmaganligi sababli, WEB sahifalarini ma'lum bir kompyuter platformasi uchun ishlab chiqilgan formatda, masalan, Windows XP uchun Microsoft Word formatida tayyorlash va saqlash mumkin emas. Har qanday turdagi kompyuterda ishlaydigan foydalanuvchi tegishli formatlangan hujjatni ko'rishi uchun ushbu maqsad uchun maxsus ishlab chiqilgan HTML tilidan foydalaniladi.

HTML aniq nima?

Agar siz brauzer bilan ishlayotgan bo'lsangiz, u holda menyu buyrug'ini tanlang View - View HTML code (View - Manba). Displeyda ushbu sahifaning HTML-dagi boshlang'ich kodi bilan oyna paydo bo'ladi.

Yoki CTRL+U tugmalarini bosing

Internetdagi WEB-sahifalarning ko'rinishi tez-tez o'zgarib turadi. Ammo biz uchun bu hozircha ahamiyatli emas.

HTML - gipermatnni belgilash tili

HTML - gipermatnni belgilash tili - bu hujjat tuzilishini tavsiflovchi juda keng tarqalgan buyruqlar to'plami. Ushbu belgilash tili hujjatning alohida mantiqiy qismlarini - sarlavhalar, paragraflar, jadvallar, ro'yxatlar va boshqalarni ajratib ko'rsatishga imkon beradi, lekin muayyan formatlash atributlarini ko'rsatmaydi. Formatlashning o'ziga xos turi hujjatni o'qiyotganda brauzerning o'zi tomonidan belgilanadi va brauzer maxsus taqdim etadi yaxshiroq ko'rsatish WEB hujjat ekraningizda.

Yuqorida aytib o'tilganidek, siz HTML kodini avtomatik ravishda ishlab chiqaradigan maxsus muharrir dasturlari yordamida WEB-sahifalarni yaratishingiz mumkin, ular bilan ishlash belgilash tilini bilishni talab qilmaydi. Ammo bu dasturlar ko'pincha o'z imkoniyatlari bilan cheklangan, xatolarni o'z ichiga oladi va ko'pincha barcha platformalarda ishlamaydigan yomon HTML kodini ishlab chiqaradi. Shuning uchun, agar siz WEB-dizaynni jiddiy o'zlashtirmoqchi bo'lsangiz va WEB-hujjatlarni yaratish tamoyillarini tushunmoqchi bo'lsangiz, HTML tilining asoslarini bilmasdan qilolmaysiz, ayniqsa unda WEB-sahifalarni yaratish unchalik qiyin emas. Ehtimol, bu HTML sahifalarini yaratish dasturini o'zlashtirishdan ham osonroqdir.

HTML tili

HTML tili bir nechta variant yoki spetsifikatsiyalarda mavjud. Dasturiy ta'minot mahsuloti versiyalari singari, spetsifikatsiyalar raqamlangan: 2.0, 3.0, 3.2, 4.0. Har qanday keyingi spetsifikatsiya avvalgisiga kengaytma va qo'shimchani bildiradi. Biz oxirgi konstruksiyalardan foydalanamiz HTML spetsifikatsiyalari 4.0 qo'llab-quvvatlanadi oxirgi versiyalari eng keng tarqalgan brauzerlar.

HTML kod oynasidagi hujjat maxsus formatdagi matn hujjatidir. Ushbu formatdagi barcha fayllar mavjud HTML kengaytmasi(.html) yoki HTM (.htm). HTML hujjati burchakli qavslar ichiga olingan belgilash elementlari bilan oddiy matnni aralashtiradi< и >, masalan, , , , . Ushbu belgilash elementlari teglar deb ataladi. Teglar bitta, ochilish va yopish bo'lishi mumkin va ma'lum bir tartibda keyingi qismlardan iborat:

• chap burchakli qavs.

Shunday qilib, HTML hujjatining boshida paydo bo'ladigan va uning boshlanishini belgilovchi ochilish tegi HTML nomi va ikkita burchakli qavsdan iborat.< >, va WEB-hujjatning oxirida joylashgan teg, belgilangan qismlarga qo'shimcha ravishda, yopilish yorlig'ini bildiruvchi va hujjatning oxirini ko'rsatadigan chiziq / belgini ham o'z ichiga oladi. Teg hujjatga kiritilgan skript dasturi kodining boshlanishini bildiradi. Bu tegda skript nomidan tashqari "vbscript" qiymatiga ega til atributi ham mavjud, ya'ni skript vbscript tilida yozilgan.

Teglarda faqat lotin belgilaridan, atribut qiymatlarida esa istalgan belgilardan foydalanish mumkin. Agar, masalan, kirillcha belgilar atribut qiymatlari sifatida ishlatilsa, ular tirnoq ichiga olinishi kerak, masalan, name="1-bo'lim".

HTML tili katta va kichik harflarni ajratmaydi, shuning uchun va teglar ekvivalentdir. Ammo 2010 yilda HTML tili spetsifikatsiyasi sohasida narsalarni tartibga solish mas'uliyatini o'z zimmasiga olgan w3c konsortsiumi o'zining so'nggi versiyasida teglarni kichik belgilarda va boshqacha qilib aytganda, muhim shartlarda yozishni tinmay maslahat beradi. Shuning uchun, keyinchalik biz kichik harflarda yozish teglaridan foydalanamiz.

Teglar html bazasi sifatida

Aksariyat teglar birlashtiriladi: ochilish tegidan keyin mos keladigan yopish tegi keladi va ular orasida matn yoki boshqa teglar mavjud, masalan:

Uch qadam onlayn kitob do'koni

Bunday hollarda ikkita teg va ular o'rtasida joylashgan hujjatning bir qismi chaqirilgan blokni tashkil qiladi HTML elementi. Ba'zi teglar, masalan, bitta va yopilish tegi yo'q. Bunday teglarning o'zi HTML elementlari hisoblanadi.

Ko'pgina teglar bir yoki bir nechta atributlarga ega bo'lishi mumkin - brauzer joriy tegni qanday qayta ishlash kerakligi haqida qo'shimcha ma'lumot beruvchi xususiyatlar. Ammo atributlar umuman bo'lmasligi mumkin. Teg atributi nomdan iborat, masalan, align, teng belgisi = va belgilar qatori bilan belgilanadigan qiymat, masalan, "center": align="center". Atribut qiymatlari odatda qo'shtirnoq ichiga olinadi. Ammo agar bu qiymatlar faqat lotin harflari, raqamlari va defislaridan foydalansa, unda tirnoqlarni olib tashlash mumkin, masalan: align=center. Ammo HTML-ning JavaScript va tillar bilan yaqinlashib kelayotgan integratsiyasi bilan bog'liq bir qator holatlar tufayli tirnoqlarni tashlab qo'yish qat'iyan tavsiya etilmaydi. Shuning uchun, atributlarni darhol tirnoq ichida yozish odatini rivojlantiring.

HTML hujjat tuzilishi

Har bir HTML hujjati o'ziga xos tuzilishga ega bo'lib, u quyidagicha ko'rinadi:

…

HTML hujjatining tuzilishi quyidagi asosiy elementlarni o'z ichiga oladi:

• teglar va hujjatning boshi va oxirini belgilaydigan;
• sarlavha va bilan chegaralangan;
• tana teglar bilan chegaralangan….

va teglari bilan chegaralangan sarlavha hujjat sarlavhasini aniqlash uchun ... teglaridan foydalanadi, unda uning mazmuni ko‘rsatilishi kerak va odatda 5-6 so‘zdan kam bo‘ladi. Ushbu sarlavha brauzerlar tomonidan dasturning ishchi oynasining sarlavha satrida ko'rsatiladi va qidiruv tizimlari uchun indekslarni tuzadigan botlar uning sarlavhasidan foydalanib hujjatni aniqlaydi.

Sarlavhada ... elementidan tashqari, masalan, hujjat haqidagi ma'lumotlarni ko'rsatish uchun ... elementlar bo'lishi mumkin. Ochilish tegi hujjatning xususiyatlarini tavsiflovchi nom=qiymat juftlarini o'z ichiga oladi, masalan, hujjat turi, uning shifrlanishi, muallifligi, kalit so'zlar ro'yxati va hokazo.Bu ma'lumotlardan qidiruv tizimlari hujjatlarni indekslashda ham foydalanadi.

HTML (HyperText Markup Language) maxsus formatlash tilidir matnli hujjatlar(u hujjatni belgilash tili deb ham ataladi - WWW hujjatni ko'rish dasturi). HTML - bu hujjat tuzilishini tavsiflovchi juda oddiy buyruqlar to'plami. HTML matnning alohida mantiqiy qismlarini (sarlavhalar, paragraflar, ro'yxatlar va boshqalar) ajratib ko'rsatish, Web-sahifaga alohida tayyorlangan fotosurat yoki rasmni joylashtirish va boshqa hujjatlar bilan bog'lanish uchun sahifadagi havolalarni tashkil qilish imkonini beradi.

HTML, masalan, Microsoft Word kabi maxsus va aniq hujjat formatlash atributlarini belgilamaydi. Hujjatning o'ziga xos turi oxir-oqibat faqat dastur tomonidan belgilanadi - brauzer kompyuteringizda. Bunday yondashuvga bo'lgan ehtiyoj apparatning heterojenligi bilan bog'liq va dasturiy ta'minot Internetga ulangan kompyuterlar. HTML ham dasturlash tili emas, lekin veb-sahifalar o'rnatilgan dasturlarni o'z ichiga olishi mumkin - skriptlar yoqilgan Javascript tillari Va Visual Basic Skript va dasturlar - appletlar Java tilida.

Nuqtai nazaridan Windows foydalanuvchisi, Web-sahifa oddiygina Internet-serverda joylashgan *.htm yoki *.html faylidir mahalliy tarmoq yoki mashinangizning qattiq diskida.

Esda tutingki, HTML dasturlash tili emas, u faqat hujjatlarni belgilash uchun mo'ljallangan. Bular. asosan yaratish HTML sahifasi, siz oddiy matn muharriridagi kabi teglar yordamida matnni tahrir qilasiz. Har bir tegning o'ziga xos xususiyati bor, lekin ularning barchasi burchakli qavslar orasida "", masalan, , .

HTML tilidagi barcha teglar ikki turga bo'linadi - juftlangan va bog'lanmagan. Juftlangan teglar ochilish tegi yopish tegini talab qiladigan teglardir. HTML tilidagi yopish teglari qiyshiq chiziq bilan belgilanadi va shunday yoziladi. Ulanmagan teglar yopish tegini talab qilmaydi. Bunday teglarga misol sifatida keyingi satr tegiga uzilish kiradi
. Bundan tashqari, barcha sahifalarda ishlatilishi kerak bo'lgan majburiy teglar va xohlagancha qo'llaniladigan ixtiyoriy teglar mavjud.