HTML teglarini joylashtirish

HTML teglarni qanday to'g'ri joylashtirish

Agar bugungi kunda har qanday veb-sahifa uchun HTML formatlashni ko'rib chiqsangiz, siz HTML elementlarini boshqa HTML elementlari ichida ko'rasiz. Boshqa qismlari "ichkarida" bo'lgan bu elementlar "ichki elementlar" deb nomlanadi va bugungi kunda har qanday veb-sahifani yaratish zarur.

Nest HTML teglar uchun nimani anglatadi?

Tushunishni tushunishning eng oson usuli - HTML teglaringizni tarkibingizni saqlaydigan qutilar deb o'ylashdir. Sizning kontentingiz matn, rasm va boshqalarni o'z ichiga olishi mumkin. HTML teglari kontent atrofidagi qutilar. Ba'zan siz boshqa qutilarning ichidagi qutilarni joylashtirishingiz kerak. Ushbu "ichki" qutilar boshqalarning ichida joylashgan.

Agar paragraf ichida qalin bo'lishni istagan matn blokingiz bo'lsa, matnning o'zi bilan bir qatorda ikkita HTML elementingiz bo'ladi.

Misol: Bu matnning jumlasi .

Ushbu matn bizning misolimizdan foydalanadigan narsadir. Bu qanday yoziladi?

Masalan: Bu matnning jumlasi.

Chunki siz "jumla" so'zini jasur bo'lishini xohlaysiz, bundan oldin ham, keyinchalik ham jiddiy teglarni ochish va o'chirishni qo'shasiz.

Masalan: Bu matnning jumlasi .

Ko'rib turganingizdek, bizda jumlaning mazmuni / matnini, shuningdek ikkinchi kalimani (kuchli yorliq juftligini) o'z ichiga olgan bitta quti (xatboshi) mavjud bo'lib, u bu so'zni qalin qilib beradi.

Teglarni joylashtirganingizda, teglarni siz ochgan tartibda o'chirib qo'yish juda muhimdir. Siz

ni ochib, uni va keyin ni bosasiz.

Bu haqda o'ylashning yana bir yo'li qutilarning o'xshashligini yana bir bor ishlatishdir. Agar siz boshqa qutiga ichki qutichni qo'ysangiz, tashqi yoki o'z ichiga olgan qutini yopishdan oldin ichki qismini yopishingiz kerak.

Ko'proq joylashtirilgan teglar qo'shish

Agar siz bir yoki ikki so'zni jasur bo'lishni istasangiz, ikkinchisini italik qilish kerakmi? Buni qanday qilish kerak.

Masalan, bu matnning jumlasi va shuningdek, kursiv matn ham mavjud.

Bizning tashqi qutimiz,

, endi ichki ichida ikkita ichki belgini - va ni ko'rishingiz mumkin. Ikkinchidan, yopiq bo'lishi mumkin bo'lgan narsalar oldin yopilishi kerak.

Misol: bu matn jumla va shuningdek, kursiv matn ham mavjud.

Bu boshqa xat. / p>

Bu holatda qutilarning ichida qutilar bor! Eng katta quti

yoki "bo'linish" dir. Ushbu oynada ichki paragraf parchalari juftligi va birinchi xatning ichida va tag juftligi bor. Yana bir bor, bugungi kunda har qanday veb-sahifani ko'rib chiqing va siz bu va yana ko'p narsalarni ko'rasiz! Bu sahifalar qutilar ichida joylashgan qutilarga qurilgan.

Nesting haqida nima uchun ehtiyot bo'lishingiz kerak

Agar siz CSS-dan foydalanmoqchi bo'lsangiz, siz joylashtirishga e'tibor berishingiz kerak bo'lgan bitta sabab. Uslublar kaskadli jadvallari hujjat ichida doimiy tarzda joylashtirilgan teglarga tayanadi va u erda uslublarning qayerda boshlanishi va tugashini bilib oladi. Agar sahifadagi "asosiy tarkib" sinfining barcha bo'limiga ta'sir ko'rsatadigan uslubni o'rnatgan bo'lsangiz, noto'g'ri joylashtirish brauzerning ushbu uslublarni qaerga qo'llashni bilishini qiyinlashtiradi. Keling, ba'zi HTML-ga qaraylik:

Misol: Bu matnning jumlasi va shuningdek, kursiv matn ham mavjud.

Bu boshqa xat bor .

Men ilgari aytib o'tganim misolni ishlatib, agar ushbu bo'linma ichidagi aloqaga ta'sir qiladigan CSS uslubini yozishni istasam va faqatgina bu havola (sahifaning boshqa bo'limlarida boshqa barcha yo'nalishlarga qarama-qarshi bo'lgan) yozishni istasam, Mening uslubimni yozish uchun ichki joy:

.main-content a {rangi: # F00; }

Boshqa sabablarga ko'ra, mavjudlik va brauzer muvofiqligi. Agar sizning HTML noto'g'ri o'rnatilgan bo'lsa, u o'qiydiganlarni va eski brauzerlarni ekranga kirish imkoniyatiga ega bo'lmaydi va hatto brauzerlar sahifani qanday to'g'ri ishlashini aniqlay olmasa, sahifaning ingl. Ko'rinishini butunlay sindira olishi mumkin, chunki HTML elementlari va teglar joy yo'q.

Nihoyat, agar siz butunlay to'g'ri va to'g'ri HTMLni yozishga harakat qilsangiz, siz to'g'ri joylashtirishni qo'llashingiz kerak. Aks holda, har bir validator HTMLni noto'g'ri deb belgilaydi.