Tarkib

• Qadamlar
• 1 -usul 1: HTML -sahifa yozish
• Maslahatlar
• Ogohlantirishlar
• Sizga nima kerak

HTML (Hypertext Markup Language) - bu veb -sahifalarni ishlab chiqish uchun asosiy dasturlash tili. Oddiy va qulay dasturlash tili sifatida yaratilgan. Internetdagi sahifalarning aksariyati ushbu tilning shakllaridan biri (ColdFusion, XML, XSLT) yordamida ishlab chiqilgan. Ushbu maqolani o'qib bo'lgach, siz Internetdagi boshqa manbalardan foydalangan holda mashg'ulotlaringizni davom ettirishingiz mumkin. Internetda ushbu mavzu bilan bog'liq boshqa maqolalarni qidirishga harakat qiling.

Qadamlar

1 -usul 1: HTML -sahifa yozish

1. 1 Bu erda keltirilgan qadamlardan biri bilan tanishishni boshlashdan oldin, "Sizga nima kerak" bo'limiga qarang.
2. 2 Ushbu muammoni tushunishni boshlashdan oldin nimani bilishingiz kerak:
3. 3 Asosiysi. Hech qachon teg haqida eshitganmisiz? Yorliq burchakli qavslar bilan o'ralgan, uning ichida so'z bor. Oxirgi teg xuddi shu shaklda yoziladi, lekin birinchi burchakli qavsdan keyin chiziq chizig'i qo'shilishi bilan. Atribut - bu tegga tafsilotlarni qo'shish uchun ishlatiladigan ixtiyoriy so'z.
4. 4 Hujjatning boshlanishi. Qaysi matn muharriridan foydalansangiz, quyidagilarni joylashtiring:
   html> head> title> wikiHow / title> / head> body> Hello World / body> / html> big> / big>
   Yorliq xuddi shu teg bilan yopilishi kerak, lekin birinchi burchakli qavsdan keyin chiziq bilan. Teglar kabi istisnolar mavjud META yoki DOCTYPE.
5. 5 DOCTYPE
   • Odatda, ko'pgina veb -sahifalar o'rnatiladi DOCTYPE ". Bu kodlashni aniqlashga yordam beradi, shuningdek uni veb -brauzerlar qanday qabul qiladi. Ko'pgina sahifalar ularsiz ishlaydi, lekin "agar siz mos kelmoqchi bo'lsangiz, bu kerak (ular Internetdagi kodlash turlarini va ulardan qanday foydalanishni tartibga soladilar).... HTML 4.01 uchun DOCTYPE quyida keltirilgan:! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> Bu bitta eng keng tarqalgan DOCTYPE butun Internet sahifalarida ishlatiladi.Birinchidan, u "html" ni tasvirlaydigan sahifaning turiga ishora qiladi, keyin u kodlash turini va nihoyat, veb -brauzer uchun sahifani tavsiflovchi DOCTYPE manzilini ajratib ko'rsatadi.
   • Har xil HTML turlari mavjud (yillar davomida ishlab chiqilgan turli xil versiyalar), masalan, yangi teglar yoki maxsus teglar yordamida. Ba'zi teglar eskirgan (o'rniga boshqa foydali teglar ishlatiladi).
   • b> va men> - bu hozirda teglarga qo'yilgan narsa, chunki ular matnni o'zgartirish uchun ishlatiladi, lekin spetsifikatsiyani emas, natijada ularni o'rniga boshqa teglar keladi. Teg kuchli> o'rnini bosadi b>va em>, o'rniga men>.
   • Oldingi teglar formatlashdan ko'ra ko'proq teglar bilan almashtirilishi muhim. Agar matn tarjima qilingan bo'lsa, unda nafaqat formatlash, balki uning ma'nosi ham o'zgarishsiz qoladi. Bu semantik jihatdan to'g'ri.
   • XHTML 2.0 versiyasida b> va men> ishlatilmaydi, xuddi HTML versiyasida 3+.
6. 6 HTML "Enkapsulyatsiya qoidasi".
   • Keling, hozirda ishlatilayotgan muhimroq teglarni ko'rib chiqaylik. Sahifani yaratish jarayonida oddiy tuzilish ishlatiladi. Agar yorliq ochilgan bo'lsa, natijada u yopiq bo'lishi kerak... Bu butun tuzilishga tegishli. Bu erda XHTML tartibi tuzilishining to'g'ri namunasi:
   • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Qattiq // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   • html xmlns = "http://www.w3.org/1999/xhtml">
   • bosh>
   • meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
   • sarlavha> Salom dunyo! / sarlavha>
   • / bosh>
   • tana>
   • h1> Salom dunyo! / h1>
   • / tana>
   • / html>
   • Xabarni yuboradigan namuna kodi Salom Dunyo... Bunga test deyiladi Salom Dunyo.
7. 7 Sarlavha
   • Veb -sahifa sarlavhasi - bu teglar orasidagi tarkib bosh>... Bu tarkibni foydalanuvchi ko'ra olmaydi (faqat sahifaning sarlavhasida ko'rsatilgan sarlavha). Teglar orasidagi ma'lumotlar bosh>, boshqa teglarni qo'shishi mumkin, masalan:
     
     
     • META yorlig'i qidiruv tizimlari va boshqa yordamchi dasturlar uchun foydali bo'lgan ma'lumotlar uchun ishlatiladi.
     • Hujjatlar o'rtasida havola yaratadigan LINK yorlig'i, masalan, uslublar (CSS) uchun.
     • SCRIPT yorlig'i, bu deyarli har qanday veb -kodlashni o'z ichiga oladi, masofadan kirish imkoniyati bilan (boshqa hujjatdan).
     • STYLE yorlig'i, bu asosan sahifaga qo'llaniladigan uslub.
     • TITLE yorlig'i - bu veb -brauzeringizda sahifaning sarlavhasi sifatida ko'rsatiladigan sarlavha.
   • Keling, ushbu veb -saytdan olingan misol sarlavhasida ulardan ba'zilarining demosini ko'rib chiqaylik (u qisqartirilgan):
     • bosh>
     • sarlavha> ... / sarlavha>
     • meta nomi = "tavsif" tarkibi = "..." />
     • havola rel = "uslublar jadvali" type = "text / css" href = "..." />
     • meta http-equiv = "content-type" content = "text / html; charset = UTF-8" />
     • uslub turi = "text / css" media = "hamma"> ... / uslub>
     • skript turi = "text / javascript" src = "..."> / script>
     • / bosh>
       
       Agar siz sezmagan bo'lsangiz, haqiqiy teglar ajratilgan holda alohida teglar ajratilgan. Misol juda qisqa, unda topilishi mumkin bo'lgan deyarli har bir teg ko'rsatilgan bosh>HTML sharhidan tashqari (biz bu haqda oddiy teglarda gaplashamiz).
8. 8 Hamma joyda oddiy teglar
   • Keling, boshqa teglarni ko'rib chiqaylik. Belgilashda ehtiyot bo'ling va "Enkapsulyatsiya" qoidasini eslang.
     
     
     • kuchli> muhim matnni ta'kidlaydi.
     • kichik> Matnni kichraytiradi. Shrift o'lchami standart birliklarda 1 dan 7 gacha o'lchanadi, 3 - standart matn o'lchami. ...
     • pre> Boy matnli blokni belgilaydi. To'g'ri, bunday matn bir xil o'lchamdagi shriftda va so'zlar orasidagi barcha bo'shliqlar bilan yoziladi.
     • em> Matnni ibora sifatida ko'rsatadi.
     • del> Matnni o'chiradi.
     • ins> Hujjatga kiritilgan matnni belgilaydi.
     • h1> Ko'p sarlavhali teglardan biri. Bu turdagi teglar "h" harfi bilan boshlanadi, raqamlar farqi bilan. Xuddi shu raqam bilan tegni yopganingizga ishonch hosil qiling.
     • p> Paragrafni belgilaydi.
     • ! --- ... ---> Boshqa teglardan farqli o'laroq, izoh tag ichida bo'lishi kerak. Bu ma'lumot faqat kod ko'rib chiqilganda ko'rinadi.
     • blockquote> Iqtibosni ko'rsatadi, uni cite> tagida ishlatish mumkin.
     • Yuqoridagi bir nechta misollar mavjud teglarning to'liq ro'yxati emas. Boshqalar haqida bilish uchun tashrif buyuring.
9. 9 Aniq tuzilmani yaratish
   • Sahifalar ma'lumotni paragraflarga ajratishimiz uchun ma'lumotlarni oddiy teglar to'plamida saqlash uchun mo'ljallangan. Kompyuter ma'lumotlarni taniydi; u kontekst yoki kontseptual ulanish haqida bilmaydi. Biz kompyuter uchun qulay HTML-sahifalarni yaratishimiz kerak. Bunga div yorlig'i yordamida erishiladi. Bu juda ko'p sonli sahifalarni yaratishga yordam beradi. Bu CSS yordamida tuzilishi mumkin va tartib uchun katta kodli jadvallar tuzishdan ko'ra osonroqdir.
     • div> Bu teg o'ziga xosdir, chunki uni foydalanuvchi ham, kompyuter ham tushunishi mumkin bo'lgan alohida ma'lumotlar bloklaridan foydalanish mumkin.
   • Keling, div tegidan foydalanadigan oddiy HTML tartibini ko'rib chiqaylik.
     • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Qattiq // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     • html xmlns = "http://www.w3.org/1999/xhtml">
     • bosh>
     • meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
     • sarlavha> Salom dunyo! / sarlavha>
     • / bosh>
     • tana>
     • h1> Salom dunyo! / h1>
     • div id = "contentOne">
     • p> Bu div # contentOne -dagi matn. / p>
     • div>
     • p> div # contentOne / p> kichik bo'limidagi paragraf
     • / div>
     • / div>
     • / tana>
     • / html>
   • Div> teglaridan foydalanish CSS va Javascript bilan ishlashda uslublarni topishga va o'zgartirishga yordam beradi. HTML yaxshi va sezgir foydalanuvchi tajribasini yaratish uchun CSS uslublari va Javascript bilan ishlash uchun turli xil kodlashni ishlatadi.

Maslahatlar

• Ushbu maqolani o'qib bo'lgach, to'xtamang va bilishingiz kerak bo'lgan hamma narsani o'rgandim deb o'ylamang. Har doim o'rganish kerak bo'lgan narsa bor, ayniqsa bu texnologiyada.
• Kodni o'rganing, tushuning va yozing.
• E'tibor bering, ba'zi teglar faqat> dan foydalanadi. Para va br ba'zi misollar. > Bilan ochilgan boshqa teglar yana yopilishi kerak. Masalan, "div> / div>".
• Odamlar yangi kashfiyotlarni kutishadi, shuning uchun kashf eting, dizayn qiling yoki kod yozing.
• Ko'p narsani o'rganganingizdan so'ng, server dasturlashni o'rganishga harakat qiling.
• CSS va Javascript bilan ishlashni o'rganing.

Ogohlantirishlar

• Esingizda bo'lsin, HTML - bu tarkibni tahrirlash. Bu shuni anglatadiki, HTML faqat tarkibni taniqli formatda saqlash uchun ishlatiladi. Boshqa o'zgarishlar CSS kabi boshqa texnologiyalar yordamida amalga oshirilishi kerak. Bu shuningdek, "Semantik jihatdan to'g'riboshqalar tan olmasa ham. Boshqa dasturlash tillari veb -sahifalarni yaratishga yordam beradi (CSS, Javascript va XML). HTML - bu kontent konstruktori.

Sizga nima kerak

• ANSI kodlashni qo'llab -quvvatlaydigan matn muharriri
• Internet Explorer yoki Mozilla Firefox kabi veb -brauzer
• (Majburiy emas) wysiwyg yoki wykiwyg HTML muharriri, masalan Adobe Dreamweaver, Aptana Studio yoki Microsoft Expression Web