CSS-dan foydalanib ikki ramka. Belgilar va ramkalar CSS-da marjali, bo'yalgan va chegaralangan element chegarasi parametrlaridan foydalangan holda

Assalomu alaykum, aziz blog o'quvchilar soni! Bugun biz kaskadli uslublar va CSS-ni o'rganishda davom etamiz. O'tgan maqolalarda biz allaqachon saytning blok tartibini ko'rib chiqdik. Natijada biz juda professional veb-sahifalarni qabul qila boshladik, ammo ularda biror narsa etishmayapti. Va ularda asosan inspektorlar va ramkalar etarli emas. Bugun biz marja va chegara qoidalarini ko'rib chiqish bilan shug'ullanamiz, bu esa HTML elementlarini indekslar va ramkalarni o'rnatishga imkon beradi.

CSS raqamli parametrlar

Uslublarning kaskadli jadvallari yordamida ikki turdagi ko'rsatkichlarni belgilash imkoniyati mavjud.

1. Ichki chiziq - Bu elementning xayoliy chegara chegarasidan o'z tarkibiga masofada joylashgan. Masofa parametrdan foydalangan holda o'rnatiladi plomba. Bunday ma'lumot elementning o'zida joylashgan va uning ichida.

2. Tashqi burma - Veb-sahifaning hozirgi elementining chegarasi va qo'shni elementlarning chegaralari yoki ota-ona elementlarining chegaralari orasidagi masofa. Massulning hajmi mol-mulk tomonidan tartibga solinadi. marja.. Bunday ma'lumot elementdan tashqarida.

Aniqlik rasmlari uchun:

Masalan, hujayra matnga to'ldirilganligini ko'rib chiqing. Keyin ichki chiziq hujayraning xayoliy chegarasi va unda matn orasidagi masofa orasidagi masofa. Tashqi burma qo'shni hujayralar chegaralari orasidagi masofa. Ichki yozuvlardan boshlaylik.

CSS-larda ichki yozuvlarni to'ldirish (yuqori, pastki, chap, o'ng)

Pladding-chap uslub xususiyatlari, pladding-tep-tozalish, o'ng va pladding-pastki, o'ng tomonga, chapda, chap tomonda, chapda, yuqori qismida, Web sahifadagi o'ng va pastki qismiga ko'rsatasiz:

Pensiya miqdorini piksellar (PX), foizlar yoki CSS uchun boshqa ruxsat etilgan bo'linmalarda ko'rsatish mumkin. Qiziqarli foizlarni belgilashda qiymat elementning kengligidan hisoblanadi. Merite qiymatida u ota-onadan meros qilib berilganligi ko'rsatilgan.

Masalan, joriy paragraf uchun men uslubiy qoidalarni, chap tomonning yuqori qismini, pikselning yuqori qismini, pikselning yuqori qismini, 35 piksel va 10 pikseldan tushirish. Qoidalarni yozib olish quyidagicha ko'rinadi:

p.Test (
Pladding chap: 20px;
Pladding-tepa: 5px;
Piktding - o'ng: 35px;
Pladding-pastki: 10px
}

AQSh qoidasi Veb-sahifadagi barcha tomonlardan fikrlarni belgilash imkonini beradi:

plomlab quyish:<отступ 1> [<отступ 2> [<отступ 3> [<отступ 4>]]]

Milliy qoidalarga o'zlari o'rtasida ajratib turadigan bir, ikkita, uch yoki to'rt qadriyatdan foydalanishga ruxsat beriladi. Bunday holda, effekt qiymatlar soniga bog'liq:

agar siz bitta qiymatni ko'rsatsangiz, u sahifaning barcha tomonlaridan omonat miqdorini belgilaydi;
agar siz ikkita qiymatni aniqlasangiz, birinchisi yuqoridan va pastdan yuqorida va pastda joylashgan qismning kattaligini bajaradi, ikkinchisi chap va o'ngda;
agar siz uchta qiymatni aniqlasangiz, avval yuqoridan chekinishning qiymatini, ikkinchisidan chapga va o'ngga, uchinchisi - pastki qismdan.
agar to'rtta qiymat belgilansa, birinchilardan yuqoridan, ikkinchisining qiymatini o'rnatadi, ikkinchisi - bu o'ng tomonda, uchinchisi, uchinchisi va to'rtinchi.

Shunday qilib, yuqoridagi CSS qoidasi iloji boricha kamaytirilishi va quyidagicha yozilishi mumkin:

p.Test (pladding: 5px 35px 10px 20px)

CSS-da marjali yoki tashqi ko'rsatkichlar

Margin-chap, marja-yuqori, marja-pastki uslubdagi atributlar sizga tegishli ravishda chapda, o'ngda, o'ngga, o'ngda, o'ngda, o'ngda, o'ngda, o'ngga, o'ngga, o'ngda, tashqi ko'rsatkichlarning qiymatlarini belgilashga imkon beradi:

marja-yuqoris Marja-huquq | Marja-past | Chapdan chapga:<значение>| Avtoulov | merosini meros qilib oling

Yuqorida aytib o'tilganidek, tashqi ko'rinishi hozirgi element chegarasidan qo'shni elementning chegarasi yoki agar qo'shni elementlar bo'lmasa, ota-ona idishi ichki chegarasiga ega.

Pensiya miqdori piksel (PX), foizlar yoki boshqa ruxsat etilgan bloklarda CSS uchun quyidagilarni ko'rsatilishi mumkin:

p (
Chapdan chap: 20px;
}
H1 (
Marja-to'g'ri: 15%;
}

Avtomatik qiymat indekslarning o'lchamlari brauzer tomonidan hisoblab chiqilishini anglatadi. Foizlar rekordidan foydalangan taqdirda, indekslar qarab hisoblangan ota-ona konteyner kengligi. Bundan tashqari, bu nafaqat chegarali va marjjir-o'ng va marja-pastki uchun ham qo'llaniladi, balki konteynerning balandligi emas, balki kengligi kengligiga qarab hisoblangan.

Tashqi ko'rsatkichlarning qiymatlari sifatida qo'llash joizdir salbiy qiymatlar:

p (
marja-chap: -20px;
}

Agar ijobiy ko'rsatkichlar bo'lsa, qo'shni elementlar harakatlansa, salbiy qiymat bilan qo'shni blok, biz bunday salbiy ma'lumotni o'rnatgan elementni oziqlantiradi.

Tashqi ko'rsatkichlar Biz shuningdek uslub atributlaridan foydalanib, spetsifikatsiya qilishimiz mumkin marja.. U veb-sahifa elementining barcha tomonlaridan bir vaqtning o'zida bir vaqtning o'zida bir vaqtning o'zida belgilaydi:

marj:<отступ 1> [<отступ 2> [<отступ 3> [<отступ 4>]]]

Bitta, ikki, uch yoki to'rtta to'plamning vazifasi misolida, qoidalarni to'ldirish kabi qonunlarga bo'ysunadi.

Chegara xususiyatlaridan foydalangan holda fram parametrlari

Freymlarni o'rnatishda uchta parametr mavjud:

chegara kengligi - ramka qalinligi;
chegara rangi - ramka rangi;
chegara uslubi - ramka chizilgan chiziq turi.

Keling, freym qalinligi parametridan boshlaylik:

chegara kengligi: [qiymati | Yupqa | O'rta | Qalin] (1,4) | meros qilib oling.

Ramka qalinligi Siz pikselda yoki CSS birliklarida mavjud bo'lgan boshqalarda o'rnatishingiz mumkin. Yupqa, o'rta va qalin o'zgaruvchilar mos ravishda 2, 4 va 6 pikselda ramkaning qalinligini o'rnatadi:

chegara kengligi: o'rta;

Plingding va marja xususiyatlariga kelsak, chegara kengligi parametri bitta, ikkita, uch yoki to'rt qiymatdan foydalanishga ruxsat beriladi, shu bilan darhol ramkaning qalinligini darhol yoki har bir alohida ravishda belgilab beradi:

chegara kengligi: 5px 3px 5px 3px

Joriy paragraf uchun eng yuqori 1px qalinligini, o'ngda 2px, pastki 3px va chap qanot: 1px 2px 3px 4px;)

Chegara chap kenglikdagi uslublar, chegara-tez kenglik, chegaradagi kenglik va chegara osti kengligi va chegara ostidagi kengligi mos ravishda, chap, yuqori, o'ng va pastki Ramkaning yon tomonlari:

Siz boshqarishingiz mumkin bo'lgan chegara ranglari framit rangi:

chegara ranglari: [rang | Shaffof]] (1,4) | meros qilib oling.

Mulk sizga bir vaqtning o'zida buyumning barcha tomonlari uchun yoki faqat belgilangan tartibda o'rnatishga imkon beradi. Qiymat sifatida, siz HTML-da qabul qilingan vazifalar usullaridan foydalanishingiz mumkin: Hekadupi kod, kalit so'zlar va boshqalar:

p (chegara kengligi: 2px; chegara rangi: qizil)

Shaffof qiynalar ramkaning shaffof rangini belgilaydi va meros merosni meros qilib oladi. Odatiy hollarda, agar ramka rangi ko'rsatilmagan bo'lsa, ushbu element ichida ishlatiladigan shrift uchun ishlatiladigan narsa ishlatiladi.

Chegara chap rangli uslubdagi atributlar, chegara-yashil rangda, chegara-pastki rangda, siz ramkadan, chapga, yuqori, o'ng va pastki qismini sozlashingiz mumkin:

Va oxirgi parametrlari chegara uslubidagi to'plamlar freym turi:

chegara uslubi: (1,4) | meros qilib oling.

Ramka turi, buyumning barcha tomonlari yoki faqat belgilangan tartibda ko'rsatish mumkin. Siz qiymatlar sifatida bir nechta kalit so'zlardan foydalanishingiz mumkin. Ko'rish ramkaning ishlatilgan brauzeriga va qalinligi bog'liqdir. Qiymati hech biri Odatiy foydalaniladi va ramkani ko'rsatmaydi va uning qalinligi nolga o'rnatiladi. Yashirin qiymat bir xil ta'sirga ega. Qalinlikka qarab boshqa qiymatlar uchun hosil bo'lgan ramka quyidagi jadvalda keltirilgan:

Chegara chap uslub uslubidagi uslubning xususiyatlari, chegara-eng yuqori uslubdagi, chegaradagi o'ng va chegara osti-uslubi va chegara osti-uslubi chiziq uslubini mos ravishda, chapga, chapga tortadi , freymning o'ng va pastki tomoni:

Tashqi va ichki ko'rsatkichlarning parametrlariga kelsak, freym uchun ramka mavjud universal chegarali mulk. Bu sizga bir vaqtning o'zida mahsulot atrofida chegaraning qalinligini, uslubi va rangini o'rnatishga imkon beradi:

chegara: | meros qilib oling.

Qiymatlar bo'sh joylar bilan ajratilgan har qanday tartibda davom etishi mumkin:

tD (chegara: 1px qattiq sariq)

Chegarani faqat ma'lum bir tomonlar bilan o'rnatish uchun chegaradagi, chegara chap, chegara chap, chegara, chapga, chapga parametrlarni belgilashga imkon beradigan xususiyatlar mavjud va doiraning o'ng tomoni.

Bu faqat umumlashtirish kerak:

vazifa uchun ichki yozuvlar Biz mulkdan foydalanamiz plomba;
sozlamalar uchun tashqi yozuvlar Qoida mavjud marja.;
frame parametrlari Atributni ishlatish chegara..

Ta'kidlaymanki, bu CSS xususiyatlari veb-sahifa elementining hajmini oshiradi. Shuning uchun, agar biz veb-sahifaning dizaynini shakllantiradigan ramka qalinligini yoki elementlarning qalinligini o'zgartirsak, biz shunga ko'ra, ular siljishi mumkin va dizayn buzilgan .

Bularning barchasi yangi uchrashuvlar!

Vlad Merzehevich

CSS-dan foydalanish, siz elementga bir necha usul bilan qo'shishingiz mumkin. Asosan, albatta, chegara mulki eng ko'p qirrali, shuningdek, reja sifatida qo'llaniladi, shuningdek, katak soyasi, uning asosiy vazifasi soya yaratish uchun asosiy vazifa. Keyingi, bu usullar va ularning o'zaro farqlarini ko'rib chiqing.

Xususiy mulk

Doira yaratish uchun eng oddiy mulk. U chegarada bir xil parametrlarga ega, ammo ba'zi bir tafsilotlar bilan bu haqda sezilarli darajada farq qiladi:

belgilangan element element atrofida (ichkarida chegarada) ko'rsatiladi;
kontur element hajmiga ta'sir qilmaydi (chegara elementning kengligi va balandligiga qo'shiladi);
tekshirish faqat elementni butunlay o'rnatishi mumkin, ammo alohida tomonlarda emas (chegara har qanday tomonda yoki bir vaqtning o'zida ishlatilishi mumkin);
chegara radiusi tomonidan belgilangan rouser radiusi (chegara faoliyatida) qo'llanilmaydi.

Savol tug'iladi - qaysi holatlarda ko'rsatgan farqlarga qaramay, uning roliga ehtiyoj seziladi, ular ro'yxatga olingan farqlarga qaramay, to'liq chegarada olib ketilganmi? Vaziyatlar unchalik ko'p emas, ammo ular uchrashishadi:

murakkab rangli ramka yaratish;
sichqonchaning kursorini arting, siz sichqoncha kursorini artib oling;
diqqatni qabul qilganda ba'zi narsalar uchun brauzer tomonidan qo'shilgan freymni yashirish;
chunki siz elementning chetidan masofani belgilangan qismdan foydalanib, yaratish uchun ramkani ramkaga o'rnatishingiz mumkin.

Ko'p rangli ramkalar

Ushbu konturning hech qanday tarzda chegarani almashtirmaydi va 1-misolda ko'rsatilganidek, u bilan hech qanday mavjud emasligini tushunish kerak.

Masalan 1. Freym yaratish

chegara va reja

Ushbu misolda, oq chegara fonidan ajratilgan element atrofida qora ramka qo'shiladi (1-rasm).

Anjir. 1. Element atrofida ramka

Foydalanishda ramka: Hover

Chegara orqali freymni qo'shishda elementning kengligi oshganda, chegarasi va psevo-klassni birlashtirganda: Hover. "G'alaba" ning ikkita usuli mavjud. Eng oddiy narsa chegarani belgilash, biz bilganimizdek, element hajmiga ta'sir qilmaydi (masalan 2).

Masalan 2. Qayta boshlaganda ramka

chizmoq

chiziq har doim ham mos kelmaydi, agar u burchaklarni yaxlitlash ishlamaydi. Bu erda ikkinchi usul mos keladi - ko'rinmas freymni yoki fon rangiga to'g'ri keladigan ramkani qo'shing va keyin harakatlanayotganda parametrlarini o'zgartiring (masalan, uchish). Keyin elementning qoplanishi ro'y bermaydi, chunki freym dastlab allaqachon mavjud. Ammo har doim elementning kengligi kengligi, chap va chegaralardagi chegaradan, chap va chegarada chegaradan iste'mol qilinishini unutmang. Shunga o'xshab, balandligi bilan.

Masalan 3. Hovering paytida ramka

chegara.

Maydon maydonlarida ramka

Ba'zi brauzerlarda (Chrome, Safari, so'nggi opera versiyalari), kichik rang ramkalari (2-rasm) ularni diqqatni jalb qilishda shakl maydonlarida ko'rsatiladi. Buni olib tashlash uchun 4-misolda ko'rsatilgandek, hech bir mulkka ega bo'lmagan mulkning qiymatini qo'shish kifoya.

Anjir. 2. Dalalar atrofida ramka

4-misolni olib tashlang

kiritish

Box soyasi orqali ramkalar

Box soya mulki elementning soyasini qo'shish uchun mo'ljallangan bo'lsa-da, siz u bilan ramka yaratishingiz mumkin va bu chegara yoki reja orqali amalga oshirilmaydi. Barcha soyalar soni cheklanmaganligi sababli, uning parametrlari vergul orqali keltirilgan parametrlar.

Freymni olish uchun dastlabki uchta parametr nolga o'rnatilishi kerak, ular soyaning pozitsiyasi va blurida javobgardir. Ushbu holatda to'rtinchi parametr chegaraning qalinligi uchun javobgar va beshinchi freymning rangi keltiradi. Ikkinchi ramka uchun to'rtinchi parametr ikkita freymning qalinligi miqdoriga teng.

4-misolda 4 ta freymning qo'shilishi va o'ng tomondagi bitta chegara bitta quti soyali mulk yordamida namoyish etiladi.

Masalan 4. Box-Soyadan foydalanish

soya

Ushbu misol natijasi rasmda keltirilgan. 3.

Anjir. 3. Box-soya mulki tomonidan yaratilgan ramkalar

Vlad Merzehevich

Jadval hajmining ramkalari yoki hujayralarida bir vaqtning o'zida engil va quyuq ranglardan foydalanish natijasida erishiladi, xayol stol veb-sahifaning fonida chiqadi. Masalan, standart jadval atrofida ramka quyma sifatida ko'rsatiladi. Garchi ushbu ramka veb-dizaynerlar bilan etarli darajada ommalashmasa-da, bu bunday doirada umuman qo'llanilmasligi kerak degani emas. Ushushlar yordamida stolni eng xilma-xilligi, shu jumladan volumetrik ko'rinishi, "kvartirasi" fonining fonida muvaffaqiyatli yoritilishi mumkin.

Uch o'lchovli ramka qalinligi chegara teg atributi bilan tartibga solinadi

Bunday holda, stolning o'zgarishi atrofida faqat tashqi chegara. Stol ichidagi chiziqlarning qalinligi o'zgarishsiz qoladi (1-rasm).

Belgilangan jadvalni yaratish uchun biz barcha mumkin bo'lgan parametrlarni jadvallarda umumlashtiramiz va chegara atributiga (masalan, 1) qo'shamiz.

Masalan 1. Chegara atributlaridan foydalanish

Stol

	2004	2005	2006
Rubinlar	43	51	79
Emeramda	28	34	48
Safirlar	29	57	36

Shu misolda stolning doirasi ikki pikselning qalinligi bor va uning turlari turli xil brauzerlarda biroz farq qilishi mumkin.

Shuningdek, uslublar, shuningdek, chegara mulkining umumbashariy uslubi yordamida jadvalning uch o'lchovliligini yaratishga imkon beradi. Kalsiyalar chiziqning uslubini va uning qalinligi jadvalini ko'rsatadi, bu jadvalning yakuniy ko'rinishi bilan juda ta'sir qiladi. Yorliqda. 1 Ba'zi qiymatlar va yakuniy natijani ko'rsatadi.

2-misolda, uslubda krujka va 5 pikselning qalinligi bilan ramkani qo'shish uchun ishlatiladi. Olingan stolning ko'rinishi anjirda ko'rsatilgan. 2.

Chegaraning uslubi stol selektoriga jadvalni yaratish uchun stol va tw va tanaviy qismlarini yaratish uchun qo'llaniladi. Shu bilan birga, turli xil hujayralar bilan aloqa qilish joylarida ikki qatorli chiziqlar bo'lmasligi uchun chegaralangan qiymat, cheklangan qiymati bilan chegara qulashi (2 misol).

Masalan 2. Uskunalar bilan ramkani yaratish

Stol

	2004	2005	2006
Rubinlar	43	51	79
Emeramda	28	34	48
Safirlar	29	57	36

Ushbu misolda, hujayralar va umuman stol atrofida chuqur kulrang ramka yaratilgan.

Uning qatoriga quyuq va yorqin chiziqlarning to'g'ri almashinishi tufayli stolning uch o'lchovli ta'siri ta'sirini yaratamiz (3-rasm).

Bu raqamda hatto stolning qatorlari, yuqoridan va quyuq kul rangdan oq gorizontal chiziqni o'z ichiga olgani ko'rsatilgan. Biroq, aksincha va aksincha va ushbu g'alati chiziqlar yuqori va qorong'i pastki qismida oq chiziq borligini ayting.

Shaklda ko'rsatilgan. 3 stol, biz ham nomli ixtiyoriy klassni taqdim etamiz va biz uni hatto stolning qatoriga qo'shamiz. Shu bilan birga, trelektori uchun chegara mulkini to'g'ridan-to'g'ri o'rnatib bo'lmaydi, bu holda ushbu holat shunchaki ko'rsatiladi. Shuning uchun biz kontekstual tanlovchilardan foydalanamiz va elementning ichida joylashgan barcha hujayralar uchun, hatto sinfdagi barcha hujayralar uchun biz chiziqni pastdan va tepada ko'rsatamiz, deydi. Orqa fonda fon rangi 3-misolda ko'rsatilgan trekturator uchun ishlatilishi mumkin.

Masalan 3. Jadval satrlarini tanlash

Stol

	2004	2005	2006
Rubinlar	43	51	79
Emeramda	28	34	48
Safirlar	29	57	36

Agar stolning pastki chizig'i bo'lsa, unda uslubda yorug'lik rangida, so'ngra stolning pastki qismida siz yorug'lik chizig'ini payqashingiz mumkin. Uning hozirligi bilan siz pastki chiziqsiz yangi stilistlarni qabul qilishingiz yoki tuzishingiz mumkin.

CSS, shuningdek, qattiq, nuqta yoki nuqtani yaratishga imkon beradi ramka Veb-sahifa elementining xayoliy chegarasiga ko'ra.

Chegara chap kenglikdagi uslubdagi atributlar, chegaradagi kengligi, chegaradagi kenglik va chegara osti kengligi va chegaraning chap, yuqori, o'ng tomonlarini aniqlaydi :

chegara chap kengligi | Chegara eng kengligi | Chegara to'g'ri kengligi |

chegara-past kenglik: ingichka | O'rta |<толщина>| Meros meros.

Biz ramka qalinligining mutlaq yoki nisbiy raqamli qiymatini yoki oldindan belgilangan qiymatlardan birini belgilashimiz mumkin: ingichka (ingichka), o'rta (o'rta) yoki qalin (yog '). Ikkinchisida haqiqiy qalinlik ramka Veb-brauzerga bog'liq. Odatiy qalinlikning qiymati ham veb-brauzerga bog'liq, shuning uchun uni aniq o'rnatishingiz yaxshiroqdir.

11.2 ro'yxatida biz bitta pikselga teng bo'lgan stol hujayralarida ramkaning qalinligini ko'rsatdik.

Ammo birinchi darajali sarlavhalarni yaratadigan uslub ramka Qalinligi 5 pikselning pastki qismi:

H1 (chegaradagi kenglik: 5px)

Aslida, barcha birinchi darajali sarlavhalar belgilanadi.

Chegara kengligi stol atributi birdaniga qalinlik qiymatlarini birdaniga ko'rsatishga imkon beradi:

chegara kengligi:<толщина 1> [<толщина 2> [<толщина 3> [<толщина 4>]]]

Agar bitta qiymat ko'rsatilgan bo'lsa, u ramkaning barcha tomonlarining qalinligi vazifasini bajaradi.

Agar ikkita qiymat ko'rsatilgan bo'lsa, birinchi vazifa yuqori va pastki qismning qalinligi, ikkinchisi - ramkaning chap va o'ng tomoni.

Agar uchta qiymat belgilansa, birinchi vazifa eng yuqori, ikkinchi - chap va o'ng va uchinchi - ramkaning pastki qismidir.

Agar to'rtta qiymat ko'rsatiladi bo'lsa, birinchi vazifa - bu yuqori qismning qalinligi, ikkinchisi - o'ng, uchinchi - pastki va to'rtinchi chap tomoni ramka.

Misol:

Td, th (chegara kengligi: ingichka)

Chegara chap rangli uslubdagi atributlar, chegara-yuqori rang, chegara-pastki rangda ranglar, mos ravishda, chapga, chap, o'ng va pastki qismida:

Shaffof qiymat "shaffof" rangni belgilaydi, ular orqali "porloq" ranglar paydo bo'ladi.

DIQQAT!

Ramka rangini har doim aniq ko'rsatilishi kerak - aks holda u chizilmasligi mumkin.

Misol:

H1 (chegaradagi kenglik: 5px
chegara-past rang: qizil)

Chegara ranglari uslubidagi atribut ramkaning barcha tomonlari uchun darhol rangni aniqlashga imkon beradi:

chegara ranglari:<цвет 1> [<цвет 2> [<цвет 3> [<цвет 4>]]]

U chegara kengligi uslubining o'xshash xususiyati bilan bir xil ishlaydi:

Td, th (chegara kengligi: ingichka;
chegara ranglari: qora)

Chegara chap qanot uslubidagi atributlar, chegara uslubidagi, chegaradagi o'ng va chegara chizig'i chiziq uslubini mos ravishda, chapda, o'ng va pastki tomonni chizadi ramka:

chegara chap uslubi | chegara-eng yaxshi uslub | chegara-to'g'ri uslub |

ridge | Qo'shish | Meros

Quyidagi qiymatlar bu erda mavjud:

Hech biri va yashirin - ramka etishmayotgan (oddiy xatti-harakatlar);

Nuqta nuqtalari - nuqta chizig'i;

Dash chizig'i;

Qattiq - qattiq chiziq;

Ikki martali chiziq;

Groove - "sotib olingan" uch o'lchovli chiziq;

Ridge - "konveks" uch o'lchovli chiziq;

INSESE - uch o'lchovli "kattaligi";

Boshlanishi uch o'lchovli "chuqurlash".

Misol:

H1 (chegaradagi kenglik: 5px
chegara past rangi: qizil
chegara-past uslub: ikki tomonlama)

Chegara uslubidagi uslub atributi sizga ramkaning barcha tomonlari uchun darhol uslubni ko'rsatishga imkon beradi:

chegara uslubi:<стиль 1> [<стиль 2> [<стиль 3> [<стиль 4>]]]

Bu chegara kengligi va chegara ranglarining uslubiy xususiyatlari kabi o'zini xuddi shunday tutadi.

Misol:

Td, th (chegara kengligi: ingichka;
chegara ranglari: qora;
chegara uslubi: nuqta

Chegara chap, chegara yuqori, chegara o'ng va chegara-pastki uslubdagi atributlar sizga mos ravishda, chap, yuqori, o'ng va pastki qismlarni belgilashingizga imkon beradi ramka:

chegara-chap | chegarasi - Yuqoriga to'g'ri | chegara-pastki |

<толщина> <стиль> <цвет> | meros qilib oling.

Ko'pgina hollarda, ushbu uslubdagi atributlar afzalroq bo'ladi:

H1 (chegarasi pastligi: 5px ikki qizi)

Global chegaradagi atribut sizga ramkaning barcha tomonlari uchun barcha parametrlarni o'rnatishga imkon beradi:

chegara:<толщина> <стиль> <цвет> | meros qilib oling.
Td, th (chegara: ingichka nuqta qora)

DIQQAT!

Freymlar veb-sahifa elementining hajmini ham oshiradi. Shuning uchun, agar biz yaratadigan bo'lsak ramka Veb-sahifaning dizaynini shakllantiradigan bloklarda biz shunga ko'ra, ushbu konteynerlarning hajmini o'zgartirishimiz kerak, aks holda ular o'zgartiriladi va dizayn buzilgan.

Bizning veb-saytimiz uchun ko'rinish

Biz o'z veb-sahifamizning dizayni va ushbu konteynerlarning chegaralari va ularning chegaralari orasidagi ignallarni yaratamiz.

Veb-brauzer oynasining chetidagi tashqi chiziqlar va veb-sahifaning tarkibi nolga teng. Veb-brauzer oynasidagi bo'sh joy eng to'liq foydalanadi.

Eslatmada

Odatiy bo'lib, har bir veb-brauzer uning oynasining chetidagi ko'rsatkichlarini va veb-sahifaning tarkibini yaratadi.

Chapdagi va o'ngdagi veb-sayt sarlavhasi bilan idishda ichki indekslar - 20 piksel. Biz boshchisning matnini veb-brauzer oynasining chetidan surishimiz kerak, aks holda sarlavha chirkin ko'rinadi.

Navigatsiya guruhi (CNavbar) va asosiy tarkib (CMain) bilan (CMain) - 10 piksel bilan tashqi ko'rinishi.

Har bir tomondan asosiy tarkib (CMain) bilan konteynerdan ichki ko'rsatkichlar - 5 piksel.

Yuqoridan (CMain) tarkibidagi ichki qism - 10 pikseldan. Shunday qilib, biz uni CNavbar va CMain konteynerlaridan ajratamiz.

Mualliflik huquqi to'g'risidagi ma'lumotlar (CCOYYVIGRULTIGRAGHT) chap va o'ngga ichki inspektorlar - 20 piksel. Mualliflik huquqi ma'lumotlarining matni, shuningdek, veb-brauzer oynasining chetidan ham ko'chirilishi kerak.

Tasodifiy qiymatlar muallif tomonidan tajriba natijasida olinadi. Siz boshqalardan so'rashingiz mumkin.

Endi biz to'rtta idishning barcha ramkalarini ajratamiz.

Konteyner tokchalar olinadi ramka bitta pastki qismida.

CMain idishi - bu chap tomoni bilan ramka.

CCopyight tasviri - bitta yuqori tomoni bilan ramka.

Freymlar biz ingichka va nuqta qilamiz. Rang sifatida, ularga # B1BEC6 (ochiq ko'k).

11.3 ro'yxati 11.3 Ro'yxatdan o'tgan Sac.css uslublarining CSS-kodini ko'rsatadi, bu biz tanlagan ko'rsatkichlar va ramka sozlamalarini amalga oshiradi.

- deb hayron bo'laylik.

Veb-brauzer oynasining chegaralari va veb-sahifaning tarkibi orasidagi burilishlarni olib tashlash uchun biz marj uslubidagi atributni ishlatdik. Uning yorlig'ini qisqartirish uslubiga kiritamiz Va ular buni 0 pikselning qiymati berdilar:

Tana (rang: # 3b4043;
fon rang: # f8f8F8;
shrift-oilasi: Verzana, Arial, Sans-Serif;
marj: 0px)

Bir xil nomdagi idishga bog'langan nomlangan toj uslubida biz ichki va o'ngga 20 pikselga teng ichki va o'ngga o'rnatdik va ramka Faqat pastki qismida. Ushbu freym ushbu idishni quyidan ajratadi:

#Cheader (kengligi: 1010px;
pasting: 0 20px;
chegara pastki: ingichka nuqta # b1bec6)

Bundan tashqari, biz ushbu idishni kengligi sifatida mutlaq qiymatni o'rnatdik. Eslatma: Qarindosh kengligida konteyner ekranini ko'rsatganda, veb-brauzer birinchi navbatda uning kengligini mutlaq qiymatini hisoblab chiqadi va keyin unga kiritilgan ko'rsatkich miqdorini qo'shadi. Natijada konteyner veb-brauzer oynasidan ko'ra kengroq bo'ladi va siqish chiziqlari biz umuman kerak bo'lmagan derazada paydo bo'ladi. Shuning uchun, idishni kengligi uchun, konteyner kengligi oshib, konteynerning kafolatlanganligi uchun mutlaq qiymatni belgilash yaxshiroqdir.

CNavbar uslubida biz 10 pikselning o'ng tomonida tashqi chiziqni ko'rsatdik - bu CMain konteyneridan CNavbar konteynerini ingl.

#Cnavbar (kengligi: 250px;
balandligi: 570px;
suzish: chapda;
margin-o'ng: 10px)

Belgilangan CMain uslubida biz ichki yozuvlarni va maydonni bitta chap tomondan so'radik - bu CMain konteynerini CNAVRAR identifikatoridan ajratadi:

#Cmain (kengligi: 760px;
balandligi: 570px;
suzish: chapda;
overfosh: avtoulov;
padding: 5px;
chegara chap: ingichka nuqta # b1bec6)

CCOPYYGHT uslubida biz chap va 20 pikselning chap va o'ng tomoniga ko'chiramiz - 10 piksel. Bundan tashqari, biz bitta yuqori tomoni bilan ramkani yaratamiz, bu CCOPULY ISTRINERNI NAZORATLARNING ASOSIDA:

#Copyright (kengligi: 1010px;
tushunarli: Ikkalasi ham;

plashding: 10px 20px 0px 20px;
chegara tepasi: ingichka nuqta # b1bec6)

Ana xolos. Mayk.cs uslublari jadvalini saqlang va veb-qidiruveridagi indeks.htm veb-sahifasini oching. Muallif bu erda rasmni bermaydi, chunki bizda yaratilgan ingichka ramka deyarli ko'rinmas. Ammo kompyuter ekranida ular juda ta'sirli ko'rinadi.

Keling, navigatsiya guruhiga qaraylik. Tasdiqlanmagan giperhavolalar CNAVRAR identifikatorining yuqori qismida zerikib ketdi, bu ularga qarashga achinadi! ichida ramka.

Yoddan yodda kelganda, navigatsiya panelimiz ro'yxati va uning shaxsiy giperhavolalari ushbu ro'yxatning nuqtalari hisoblanadi.

Bu erda kerakli o'zgarishlar:

Giperhavolalarni larzaga keltiradigan ro'yxat, chapga 30 pikselga o'ting. Shunday qilib, biz chap tomondagi markerlarni olib tashlaganingizdan so'ng hosil bo'lgan bo'sh joyni yo'q qilamiz.

Ro'yxat nuqtalaridan yuqorida va pastdan 10 pikselda tashqi ko'rsatkichlar. Shunday qilib, biz giperhavolalarni bir-biridan ajratamiz.

Ro'yxatli nuqta freym - ingichka, qattiq, rangli # b1bec6.

Ro'yxatning ichki ko'rsatkichlari: yuqorida va pastdan 5 piksel, chap va o'ngdan - 10 piksel. Shunday qilib, biz buyumlarning matnini ajratamiz ramkalar.

Bu faqat asosiy.css uslublarining CSS kodini tuzatish uchun faqat shunday bo'lib qoladi (11.4).

Ularni batafsilroq ko'rib chiqing.

Navigatsiya guruhini tashkil etuvchi ro'yxat yorlig'iga bog'langan Navbar uslubi, biz chapga -30 pikselga teng bo'ldik. Buning uchun rahmat, ro'yxat chap tomonga siljiydi, bo'sh joyni to'ldiradi:

#Navbar (shrift-oilasi: aral, sandal - serif;
shrift hajmi: 14PT;

matnni o'zgartirish: katta harf;
ro'yxat turi: Yo'q;
marja-chap: -3px)

Yangi tashkil etilgan kombinatsiya uslubi Navigatsiya guruhi ro'yxatining ro'yxatini yaratadi. ramka va mos keladigan ko'rsatkichlarni o'rnating:

#Navbar Li (to'ldirish: 5px 10px;
marj: 10px 0px;
chegara: ingichka qattiq # b1bec6)

Ruxsat etilgan uslublar jadvalini saqlang va kalitni bosib indeks.htm veb-brauzerini yangilang . Bu unchalik yaxshilandi, bu emas (11.1-rasm)?

Mulk CSS. – « chegara."Elementning atrofidagi perimetik atrofida qalinligi, rangini, rangini va turini o'rnatishga imkon beradi. Ushbu mulk parametrlari bo'sh joy orqali va har qanday tartibda ajratilgan bitta satrda yozilishi mumkin.

- chiziq qalinligi bitta piksel
- qattiq chiziq
- oq rang
- qora rang
- kul rang

Qattiq element chegarasi

Ish tashlash elementi

Elementning nuqta chegarasi

Ikkita qator element chegarasi

Shaxsiy chegara hududlarining mulki

Hajmda kavisli gofrirovka qilingan ramka

Gofrirovka qilingan ramka hajmida

Hajmli tushkunlikka tushdi

Volumetric konvex fraksiyasi

Darslar / CSS /

Dars 7. CSS element ramkasi

Deyarli har bir sayt element atrofida ramkani yaratadigan mulkdan foydalanadi. Buning uchun yoki matnli bloklar uchun ham kerak. CSS-ning elementidan ramka yaratish uchun ikkita xususiyat mavjud: chegara va parametr. Ularni ko'rib chiqaylik.

chegara.

Ushbu mulk element atrofida ramkani o'rnatishi kerak, uning veb-hujjatdagi chegaradan dalolat beradi, element joylashgan bo'lsa, ramka kengligi hisobga olinadi. Uning 3 qadriyatiga ega - rangi, qalinligi va ramka turi mavjud.

Chegara mulkining sintaksisi quyidagicha:

chegara: kenglik tipidagi rang;
Siz mol-mulk qiymatlarini tavsiflashning boshqa tartibini tanlashingiz mumkin, ammo eng muhimi makon orqali.

Freymning qalinligi (kengligi) yoki foizda (%) belgilanishi kerak.
Rang RGB formatida (qizil yashil ko'k) yoki HTML Hex Kodekasida o'rnatilishi mumkin.

Quyida keltirilgan Chiziq turlari Ularning ismlari bilan:

Qanday qilib ramkalarni elementdan qanday sozlash kerak? Biz quyidagicha qilamiz:

#block (
Chegara: 3px qattiq # 0085S; / * 3 ta pikselli piksel qalin * /
}

Agar siz bir yoki ikki yoki uchtasini o'rnatmoqchi bo'lsangiz ma'lum bir tomondan ramkalarMen shunday deb belgilayman:

chegara yuqori. - yuqoridan ramka;
chegarasi. - pastdan ramka;
chegara qoldi. - chap tomonda ramka;
chegara - o'ng tomonda ramka;

Blok (
Chegara o'ng tomoni: 3px qattiq # 0085CC;
Chegara pastki: 2px # 0085CC;
}

Agar Siz hohlasangiz freymlarni olib tashlang CSS-da element, keyin chegara mulkini so'rang - yo'q

Bo'sh (
Chegara: Yo'q; / * Bo'sh sinfli element ramka bo'lmaydi * /
}

chizmoq

Belgilangan element - bu elementning tashqi ramkasini o'rnatish uchun o'rnatilishi kerak bo'lgan mulk.

u yerda chegaradan ikkita farq:
Birinchidan, konturda ko'rsatilgan chiziq blokning o'zi, uning kengligi va balandligiga ta'sir qilmaydi.
Ikkinchidan, ramkani ma'lum bir tomondan o'rnatish qobiliyati yo'q.
Sintaksis chegarasi bilan bir xil.

chegar: 0085CC-№2px nuqta; / * Frame 2 piksel nuqta * /
Chegara uchun, siz chegaradan boshqa gapirish orqali ramkalarni olib tashlashingiz mumkin.

Diqqat uchun rahmat!

Oldingi maqola
6-dars.

Elementning chegaralari.

CSS-dagi ko'rsatkichlar va maydonlar. Marj va bezash nima? Keyingi maqola
8-dars. Qanday qilib matnning rangini va CSS-ning elementini qanday sozlash kerak?

Maqoladagi sharhlar (VK.com)

chegara.

Qo'llab-quvvatlash brauzerlari

12.0+

4.0+

1.0+

3.5+

1.0+

Tavsif

CSS mulki sizga bir vaqtning o'zida blokning chegarasi, uslubi va rangini o'rnatishga imkon beradi. Blokning chegarasi - bu blokni har tomondan o'rab turgan oddiy chiziq / ramk. Shuni yodda tutish kerakki, ramkani qo'shganda, u blokning umumiy hajmiga ta'sir qiladi.

Qiymatlar bo'shliq bilan ajralib turadi va har qanday tartibda kuzatilishi mumkin, brauzer qaysi biri istalgan parametrga to'g'ri keladi. Barcha uchta qiymatni belgilash shart emas, kengligi va / yoki rangini qoldirilishi mumkin, unda standart mulk o'rniga belgilangan qiymatdan foydalaniladi, i.e. Agar kenglik ko'rsatilmagan bo'lsa, standart mulk ishlatiladi. Sintaksis ostida joylashgan stolda, xususiyatlarning qiymatlari ishlatilishi mumkin.

Eslatma: Freymlarni faqat buyumni belgilash uchun quyidagi xususiyatlardan foydalaning: chegara-yashil, chegara chap, chegaradan chapga.

Maslahat: qoida tariqasida, ramkadan foydalanganda ichki yozuvlarni qo'shishingiz kerak.

CSS Mulk: chegara

Ular blok ramkasi va uning tarkibi o'rtasida bo'sh joyni qo'shadi: matn, rasmlar yoki bolalar teglari. Odatda, chegara buyum tarkibiga yaqin ko'rinadi, agar siz rasm atrofiga ramkani o'rnatishingiz kerak bo'lsa.

Sintaksis

chegara: Chegara kengligi chegara uslubining chegarasi | merosini olish;

Mulk qiymatlari

Misol

Bu erda bir nechta matn mavjud.

Ushbu misol natijasi brauzer oynasida:

Qanday qilib ranglar, uslublar va chegara hajmini qutichalarni sozlash kerak.

Belgilangan tillarda, chegarada ( chegara.), ba'zi bir stol, rasmlar va ramkalar mavjud, ba'zi hollarda chegaraning rangini va barchasini belgilash mumkin.

Atribut chegarasi

Cascade uslubidagi varaqlar bizga ko'proq imkoniyatlar beradi, ammo hamma narsada hamma narsa haqida.

CSS-da biz ramkaning kengligini (chegara) yordam bilan boshqara olamiz chegara kengligi.Va agar aniqroq bo'lsa, biz har bir tomonning qalinligini alohida mahkamlashimiz mumkin:
chegara eng kengligi - yuqori chegirmaning qalinligi
chegara to'g'ri kengligi - o'ng chegaraning qalinligi
chegaraning pastki kengligi - pastki chegaraning qalinligi
chegara chap kenglik - Chap chegaraning qalinligi
Ammo qisqartirilgan shakli bo'lishi mumkin:
P (chegara kengligi: yuqori o'ng pastki chap;) (Yuqori o'ng chapda).
Chegaraning kengligi sozlanishi mumkin:
raqamlar DIS (chegara kengligi: 5px), noldan cheksizgacha, i.e. Ijobiy.
yupqa. - Slim chegarasi, Div (chegara kengligi: ingichka)
o'rta. - O'rta burma, DIS (chegara kengligi: o'rta)
qalin. - Yog'li Bord, Div (chegara kengligi: qalin)
Raqamlar bilan aniq, ammo bu qadriyatlar bilan barchasi brauzerga bog'liq, ammo baribir yupqa.<= medium <= thick .

Shunday qilib, biz chegaraning rangi bilan yordam bilan boshqaramiz chegara ranglari Yoki, agar har bir tomonga aniqroq rangda bo'lsa:
chegara yuqori qismida yuqori chekkaning rangi;
chegara o'ng rangi o'ng chegaraning rangi;
chegaradosh pastki chegaraning rangi;
chapning chap ranglari Chap tomonda Borker rangi.
Rang qiymati uchun belgilangan rang. 16 rangdan biri: aqua, qora, ko'k, fuchsiya, kulrang, yashil, ohak, maroon, falon, zaytun, binafsha, qizil, oq yoki sariqShuningdek, ranglar o'rnatilishi mumkin: rang: # 000000, rang: # af1 , rang: RGB (255,0,0) yoki rang: RGB (100%, 0%, 0%).
Qaysi rang sxemasiga qarab, brauzerlar hali ham ichiga tarjima qilinadi rang: RGB (255,0,0). masalan rang: ohak. = rang: # 00ff00 = rang: # 0F0 = rang: RGB (0%, 100%, 0%)va va brauzer hali ham rang: RGB (0,255.0). Bu ushbu qiymatni hisoblaydi.

Agar chegaraning qalinligi va rangi boshqarilishi va HTML Style ( chegara uslubi.) Faqat CSS !!!
Uslubni har ikki tomondan alohida boshqarish mumkin:
chegara tetik uslubi Yuqori chegara uslubi;
chegara to'g'ri uslubi O'ng chegaraning uslubi;
chegaradagi past uslub pastki chegaraning uslubi;
chegara chap qanot uslubi Chap tomonda chegara uslubi.
Endi stillik qadriyatlarini ko'rib chiqing:
1)chegara uslubi: yo'q - Bu chegara kengligiga o'xshash, bu standart qiymati: 0.
2)chegara uslubi: yashirin - Xuddi shu, jadvallar bundan mustasno (jadval), keyinroq ko'rib chiqamiz.
3)chegara uslubi: nuqta - ochkolardagi bo'yoq.
4)chegara uslubi: tiriltirilgan - tirilgan chiziqdan chegara.
5)chegara uslubi: qattiq - Qattiq chiziqdan chegara, i.e. HTML kabi.
6)chegara uslubi: ikki baravar - Ikkala qattiq chiziqdan chegaradir, bu erda sizga qalinligi (chegara kengligi) kamida 3pikselga muhtoj.
7)chegara uslubi: Groove - Chegara tuvalda o'yilganga o'xshaydi.
8)chegara uslubi: tizmasi - Chegara Kanada chiqib ketishga o'xshaydi.
9)chegara uslubi: qidirish - Butun quti tuvaldagi maydalanganga o'xshaydi.
10)chegara uslubi: boshlanishi - avvalgisining teskarisi.
Ba'zi brauzerlar qadriyatlarni e'tiborsiz qoldirishi mumkin: nuqta, siqilgan, dubl, duber, tog 'tizmasi, qimirlash, qimirlash va ularni qattiq, i.e. Oddiy chegara.

Albatta, albatta, bu shunday, ammo yuqoridagi barcha misollar faqat operatsiya printsipi va mexanizm emas.
Mulk qoidalari chegara. nazarda tuting (chegarasi: o'lchamdagi rang hajmi;), ushbu qoida uchta qiymat va faqat bunday ketma-ketlikda amalga oshiriladi H1 (chegara: 5px juftligi;)Ammo agar ushbu qiymatlar oyat tillarida bo'lsa, masalan, stol uchun mo'ljallangan bo'lsa, istisnolar bo'lishi mumkin Stol (chegara: 2px). Faqat bitta qiymat o'rnatildi.

Hamma chegaralarni boshqarish uchun va har bir qism alohida qoidalar mavjud:
(Chegara-Yuqoridagi: o'lchamdagi rang hajmi;) Chegaraning yuqori davolash;
(Chegara o'ng tomoni: o'lchamdagi rang hajmi;) O'ng tomonda chegara nazorati;
(Chegara pastki: o'lchamdagi rang hajmi;) Chegaralarni boshqarishning pastki qismida;
(Chegara chap: o'lchamdagi rang hajmi;) Chapdagi taxtalarni boshqarish.
Ushbu qoidalardan alohida va barchasi birgalikda foydalanish mumkin.

Istisno bu qoida:
H1 (
Chegara: 4px qattiq yashil;
}
Gap shundaki, CSS-da so'nggi qoida eng yuqori ustuvorlikka ega, bu holatda chegara qoldiqlari chegaradan iborat va shu sababli chegaradan tashqari chegarada quyidagilar mavjud.
H1 (
Chegara: 4px qattiq yashil;
Chegara chap: 2px juftlik;
}
Dastlab biz butun chegara uchun qoidalarni, so'ngra delometrik joylardan o'rnatdik.

Menda elementlar uchun hamma narsa bor, ba'zi xususiyatlar bundan mustasno, jadvallar va boshqa istisnolarga borganingizda, ba'zi xususiyatlardan tashqari.

CSS: chegara. Elementning chegaralari.

CSS3 chegaralari

CSS3-dan foydalanib, siz dumaloq chegaralarni yaratishingiz, konteynerlarga soya qo'shishingiz va tasvirni chegara sifatida ishlatishingiz va fotoshop kabi dizayner dasturidan foydalanmasdan foydalaning.

Ushbu darsda siz quyidagi chegara xususiyatlari haqida bilib olasiz:

chegara radiusi.
soya
chegara tasviri.

Qo'llab-quvvatlash brauzerlari

Mulk	Qo'llab-quvvatlash brauzerlari
chegara radiusi.
soya
chegara tasviri.

Internet Explorer 9 ba'zi yangi chegara xususiyatlarini qo'llab-quvvatlaydi.

Firefox chegara tasviri uchun prefiks -mon -Mozni talab qiladi.

Chrome va Safari chegara-tasvir uchun -webkit konsollarini talab qiladi.

Opera chegara tasviri uchun prefiksni talab qiladi.

Safari shuningdek Prefiks -webkit - Box-Soya uchun.

Opera yangi chegara xususiyatlarini qo'llab-quvvatlaydi.

CSS3 yumaloq burchaklar

CSS2 ga aylanma burchaklarni qo'shish ayyor edi. Har bir burchak uchun turli xil tasvirlardan foydalanishimiz kerak edi.

CSS3-da yaxlitlangan burchaklar yaratish oddiy.

CSS3-da chegara burchaklarini yaratish uchun chegara-chegarasi ishlatiladi:

Ushbu jihoz yumaloq burchaklar bor!

CSS3 soyali idish

CSS3-da, qutilarga soya solib, idishlarga soya qo'shish uchun ishlatiladi:

CSS3 chegara-i rasm

CSS3 tomonidan chegarani yaratish uchun tasvirdan foydalanishingiz mumkin:

Chegara tasviri mulki chegara tasvirini belgilashga imkon beradi!

Chegarani yaratish uchun ishlatiladigan asl rasm:

Yangi chegara xususiyatlari

Atribut chegarasi

Atribut chegarasi, Tata

, U stol atrofida ramkaning qalinligini ko'rsatish uchun ishlatiladi.

HTML chegaralari.

Chegara qiymatisiz chegaradan foydalanish joizdir, keyin ramka qalinligi bitta pikselga teng bo'ladi. Odatiy bo'lib, freym uch o'lchovli ta'sir ko'rsatadi, ammo agar siz fon atributini qo'llasangiz, ramka "tekis" bo'ladi.

Bundan tashqari, agar chegara atributida nolga teng bo'lmagan qiymatga ega bo'lsa, brauzerlar hujayralar atrofidagi ingichka chegaralarni ko'rsatishadi. Ushbu chegaralarni ko'rsatish qoida atributi yordamida boshqarish mumkin.

Qiymatlar

Atribut qiymati pikselda o'lchamdagi shaxsiy bo'lmagan raqam bo'lishi mumkin.

Odatiy qiymat: 0.

Sintaksis

Majburiy atribut: Yo'q.

HTML misollari: chegara atributlarini qo'llang

Misol natijasi

Natija. Chegara atributlarini qo'llang.