CSS tugmalar
Tugma ranglari
Tugma o‘lchamlari
Faol/nofaol tugmalar
Blok darajasidagi tugma
Tugmalar guruhi
Tugma klasslari
Quyidagi klasslar yordamida istalgan <a>, <button> yoki <input> elementini bezash mumkin:
| Klass | Tavsif | Misol |
|---|---|---|
| .btn | Istalgan tugmaga asosiy stillarni qo‘shadi | Sinab ko‘ring |
| .btn-default | Standart (odatiy) tugmani bildiradi | Sinab ko‘ring |
| .btn-primary | Qo‘shimcha vizual urg‘u beradi va tugmalar to‘plamidagi asosiy amalni belgilaydi | Sinab ko‘ring |
| .btn-success | Muvaffaqiyatli yoki ijobiy harakatni bildiradi | Sinab ko‘ring |
| .btn-info | Axborot beruvchi ogohlantirish xabarlari uchun kontekstual tugma | Sinab ko‘ring |
| .btn-warning | Bu amalda ehtiyot bo‘lish kerakligini bildiradi | Sinab ko‘ring |
| .btn-danger | Xavfli yoki salbiy oqibatga olib kelishi mumkin bo‘lgan harakatni bildiradi | Sinab ko‘ring |
| .btn-link | Tugmani havola kabi ko‘rinadigan qiladi (tugma xatti-harakati saqlanib qoladi) | Sinab ko‘ring |
| .btn-lg | Katta tugma yaratadi | Sinab ko‘ring |
| .btn-sm | Kichik tugma yaratadi | Sinab ko‘ring |
| .btn-xs | Juda kichik tugma yaratadi | Sinab ko‘ring |
| .btn-block | Blok darajasidagi tugma yaratadi (ota elementning butun kengligini egallaydi) | Sinab ko‘ring |
| .active | Tugmani bosilgan ko‘rinishga keltiradi | Sinab ko‘ring |
| .disabled | Tugmani nofaol qiladi | Sinab ko‘ring |
| .navbar-btn | Navigatsiya paneli ichidagi tugmani vertikal tekislaydi | Sinab ko‘ring |
Tugmalar guruhi klasslari
Quyidagi klasslar yordamida istalgan <a>, <button> yoki <input> elementini bezash mumkin:
| Klass | Tavsif | Misol |
|---|---|---|
| .btn-group | Tugmalarni bitta qatorda guruhlaydi | Sinab ko‘ring |
| .btn-group-justified | Tugmalar guruhini ekranning butun kengligini egallaydigan qiladi | Sinab ko‘ring |
| .btn-group-lg | Katta tugmalar guruhi (tugmalar guruhidagi barcha tugmalarni kattalashtiradi — shrift o‘lchami va ichki chekinish oshadi) | Sinab ko‘ring |
| .btn-group-sm | Kichik tugmalar guruhi (tugmalar guruhidagi barcha tugmalarni kichraytiradi) | Sinab ko‘ring |
| .btn-group-xs | Juda kichik tugmalar guruhi (tugmalar guruhidagi barcha tugmalarni juda kichik qiladi) | Sinab ko‘ring |
| .btn-group-vertical | Tugmalar guruhini vertikal ravishda ustma-ust joylashgan ko‘rinishga keltiradi | Sinab ko‘ring |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!