Ko'pincha HTML-sahifalardagi indentlar hajmini belgilash uchun CSS tilining imkoniyatlaridan foydalaniladi (Cascading Style Sheets). Garchi HTML tilida bir nechta "ibtidoiy" qoldiqlar mavjud bo'lsa-da, ba'zi holatlarda chuqurlik o'rnatishga imkon beradi. Quyida tez-tez ishlatiladigan variantlar keltirilgan, ammo ulardan tashqari hanuzgacha HTML-hujjatlarni nostandart belgilash uchun indentlarni o'rnatishga imkon beradigan juda ko'p turli xil fokuslar mavjud.
Bu zarur
HTML va CSS tillari haqida asosiy bilimlar
Ko'rsatmalar
1-qadam
Chiqib ketish kerak bo'lgan sahifa elementini aniqlang. Masalan, agar matn … (blok) yorlig'i ichiga joylashtirilgan bo'lsa, u holda bu blok ushbu matn uchun asosiy element bo'ladi va indent blok blok chegaralaridan hisoblanishi kerak. Va agar matn (yoki rasm) biron bir blok (div, li va boshqalar) yoki ichki (span, p va boshqalar) elementlar ichida bo'lmasa, uning asosiy qismi hujjat tanasi (tanasi yorlig'i) bo'ladi. Matn uchun ota-ona elementini aniqlash zarur, chunki aynan u indentlarni hosil qiladigan uslublarning tavsiflarini o'rnatishi kerak. Matningiz div blok ichiga joylashtirilgan deb taxmin qilaylik: Namuna matni
2-qadam
Chegaralarni, ya'ni element chegaralaridan qo'shni elementlarga, shuningdek, bosh element chegaralariga masofani o'rnatish uchun CSS tilining margin xususiyatidan foydalaning. Ushbu masofani har ikki tomondan to'ldirish uchun alohida belgilash mumkin: margin-top - tepada, margin-right - o'ngda, margin-pastki - pastki qismida, margin-left - chapda. Yuqoridagi misol uchun ushbu CSS kodi quyidagicha ko'rinishi mumkin: div {
margin-top: 10px;
margin-right: 15px;
chekka-pastki: 40px;
chekka-chap: 70px;
} Bu erda "div" bu uslubni hujjat kodidagi barcha divlarga nisbatan qo'llanilishini belgilaydigan selektor. CSS sintaksisi to'rt satrni biriga birlashtirishga imkon beradi: div {
hoshiya: 10px 15px 40px 70px;
} Chiqishlarning qiymatlari har doim shu tartibda ko'rsatilishi kerak: birinchi navbatda - yuqori qismida, so'ngra - o'ngda, pastki va chapda. Agar indententlar har tomondan bir xil bo'lsa, unda qiymatni ko'rsatish kifoya bir marta: div {
margin: 70px;
} Bundan tashqari, siz suzuvchi gorizontal chegarani o'rnatishingiz mumkin (ya'ni chapga va o'ngga). Bu sizga brauzer oynasining markazida aniq kenglikdagi blokni o'rnatishingiz kerak bo'lganda juda foydali bo'lishi mumkin. Brauzerning o'zi avtomatik ravishda har ikki tomonda qancha chuqurlik bo'lishi kerakligini belgilaydi, agar siz quyidagi CSS bayonotini yozsangiz: div {
margin: 0 avtomatik;
}
3-qadam
To'ldirishni o'rnatish uchun to'ldirish xususiyatidan foydalaning, ya'ni element chegarasidan uning ichiga joylashtirilgan har qanday elementlarga, shu jumladan matnga qadar bo'lgan masofa. Ushbu xususiyat sintaksisi margin xususiyati bilan bir xil: div {
plomba-yuqori: 10px;
to'ldirish-o'ng: 15px;
pastki to'ldirish: 40px;
to'ldirish-chap: 70px;
} Yoki div {
to'ldirish: 10px 15px 40px 70px;
}
4-qadam
Matn-indent xususiyatidan foydalanib, matnning har bir xatboshisining birinchi satri uchun qo'shimcha indentatsiyani o'rnating. Masalan: div {
matnli indent: 80px;
}
5-qadam
HTML img tegining hspace va vspace atributlaridan foydalanib, mos ravishda rasmdan tashqi elementlarga gorizontal va vertikal chuqurchani o'rnating. Masalan, shunga o'xshash:
6-qadam
Jadvaldagi yacheykalarning chegaralaridan ularning tarkibiga kirishni belgilash zarur bo'lsa, jadval yorlig'ining cellpadding atributidan foydalaning. Va hujayra oralig'i atributi jadval hujayralari orasidagi masofani o'rnatadi. Masalan:
| 1 | 2 |
