Bootstrap cards asosiy vazifalari

bootstrap cards asosiy vazifalari

Bootstrap kartalari bir nechta variant va variantlarga ega moslashuvchan va kengaytiriladigan kontent konteynerini taqdim etadi.

Misol

Kartalar iloji boricha kamroq belgilar va uslublar bilan yaratilgan, ammo baribir tonna nazorat va sozlashni ta'minlay oladi. Flexbox bilan yaratilgan ular oson tekislashni taklif qiladi va boshqa Bootstrap komponentlari bilan yaxshi aralashadi. Ularda marginsukut bo'yicha yo'q, shuning uchun kerak bo'lganda oraliq yordamchi dasturlardan foydalaning.
Quyida aralash tarkibli va belgilangan kenglikdagi asosiy kartaning namunasi keltirilgan. Kartochkalarda boshlash uchun belgilangan kenglik yo'q, shuning uchun ular tabiiy ravishda asosiy elementning to'liq kengligini to'ldiradi. Bu bizning turli o'lcham variantlarimiz bilan osongina moslashtiriladi .

class="card-title">Card title

class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere

Tana

Kartaning qurilish bloki bu .card-body. Karta ichida to'ldirilgan qism kerak bo'lganda undan foydalaning.

This is some text within a card body.

Sarlavhalar, matn va havolalar

.card-titleKarta sarlavhalari tegga qo'shish orqali ishlatiladi . .card-linkXuddi shu tarzda, havolalar qo'shiladi va tegga qo'shish orqali bir-birining yoniga joylashtiriladi .
.card-subtitleSubtitrlar tegga a qo'shish orqali ishlatiladi . Agar .card-titleva .card-subtitleelementlari elementga joylashtirilsa .card-body, kartaning sarlavhasi va taglavhasi yaxshi tekislanadi.

class="card-title">Card title

class="card-subtitle mb-2 text-muted">Card subtitle

class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.

Card link

Another link

Tasvirlar

.card-img-toptasvirni kartaning yuqori qismiga qo'yadi. , bilan .card-textmatn kartaga qo'shilishi mumkin. Ichidagi matn .card-textstandart HTML teglari bilan ham uslublanishi mumkin.

class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.

Guruhlarni ro'yxatga olish

Flaş ro'yxati guruhiga ega kartada kontent ro'yxatini yarating.

• Cras justo odio


• Dapibus ac facilisis in


• Vestibulum at eros

Oshxona lavabosi

Kerakli kartani yaratish uchun bir nechta kontent turlarini aralashtiring va moslang yoki u erda hamma narsani tashlang. Quyida tasvir uslublari, bloklar, matn uslublari va ro'yxatlar guruhi ko'rsatilgan - barchasi belgilangan kenglikdagi kartaga o'ralgan.

class="card-title">Card title

class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.

• Cras justo odio


• Dapibus ac facilisis in


• Vestibulum at eros

Card link
Another link