• Responsive veb-dizayn nima
  • Ishni boshlash
  • Bordered Table
  • Basic Well
  • . alert-warning . alert-danger.
  • Misol Bootstrap tugmalari
  • Bootstrap glifikonlari (Glyphicons)
  • Misol
    		•

    Bootstrap bilan responsive web dizayn




    Download 488.06 Kb.
    Sana02.11.2023
    Hajmi488.06 Kb.
    #93327
    Bog'liq
    Bootstrap 1
    SAIDOV KAMOLIDDIN SHAROFIDDIN O‘G‘LI QAYD VARAQA, 65487e378533d, Pdf, topshiriqq (1)

    BOOTSTRAP bilan RESPONSIVE WEB dizayn


    Taqdim etgan:
    Bekturdiyev S.Sh.
    Taqdim etilgan:
    Toshkent davlat texnika universiteti

    Kirish

    • Bootstrap Twitter-da Mark Otto va Jeykob Tornton tomonidan ishlab chiqilgan va 2011-yil avgust oyida GitHub-da ochiq kodli mahsulot sifatida chiqarilgan .
    • 2014 yil iyun oyida, №. GitHub-da 1 ta loyiha.
    • Bootstrap sezgir, birinchi mobil veb-saytlarni ishlab chiqish uchun eng mashhur HTML, CSS va JavaScript ramkasidir .
    • Bootstrap-ni yuklab olish va ishlatish mutlaqo bepul!

    Responsive veb-dizayn nima

    • Responsive veb-dizayn kichik telefonlardan tortib katta ish stoligacha bo'lgan barcha qurilmalarda avtomatik tarzda yaxshi ko'rinishga moslashadigan veb-saytlarni yaratish haqidadir .
    • Bootstrap sizga sezgir dizaynlarni

    Nima uchun Bootstrap ishlatiladi?

    • Foydalanish oson: HTML va CSS-ni oddiy bilgan har bir kishi Bootstrap- dan foydalanishni boshlashi mumkin
    • Javob beruvchi xususiyatlar: Bootstrap-ning sezgir CSS telefonlar, planshetlar va ish stollariga moslashadi
    • Mobil-birinchilik yondashuv: Bootstrap 3-da mobil-birinchilik uslublar asosiy tizimning bir qismidir.
    • Brauzer mosligi: Bootstrap barcha zamonaviy brauzerlar bilan mos keladi

    Ishni boshlash

    Bootstrap Heading


    Bootstrap Paragraph

  • Bordered Table


  • The .table-bordered class adds borders to a table:
    • Firstname Lastname
    John Doe
    Mary Moe

  • < div >

    Basic Well

    Bootstrap ogohlantirishlari (Alerts)

    • Ogohlantirishlar .alert sinfi, keyin esa to'rtta kontekstli sinfdan biri bilan yaratiladi

      • . alert-success,

      . alert-info,

      . alert-warning &

      . alert-danger.

    • Ogohlantirish xabarini yopish uchun havola yoki tugma elementiga va data-dismiss="alert" qo'shing :
    • × Success!This alert box indicates a successful or positive action.

    Animatsiyali ogohlantirish (Alert)

    • .fade va .in sinflari ogohlantirish xabarini yopayotganda o'chirish effektini qo'shadi :
    • orqali biz ushbu maxsus ogohlantirishlarni yashiramiz.

    Misol

    Bootstrap tugmalari

    • Bootstrap tugmalarning ettita uslubini taqdim etadi :
    • .btn-default
    • .btn-primary
    • .btn-success
    • .btn-info
    • .btn-warning
    • .btn-danger
    • .btn-link

    Misol

    • Default Primary Success Info Warning Danger Link

    Tugmalar guruhlari

    • Bootstrap bir qator tugmalarni birga guruhlash imkonini beradi (bir chiziqqa yoki vertikal chiziqdqa) 
    • .btn-group Sinfdan foydalanib Gorizontal tugmalar guruhini yaratish mumkin.
    • btn -group-vertical Sinfdan foydalanib Vertikal tugmalar guruhini yaratish mumkin.
    • btn -group-justify Sinfdan foydalaning ikki tomondan bir hil tugmasi guruhini yaratish uchun

    Tugmalar guruhlari

    Bootstrap glifikonlari (Glyphicons)

    • Glyphiconlardan matn, tugmalar, asboblar paneli, navigatsiya, formalar va boshqalarda foydalanish mumkin .
    • Glyphlarning ba'zi misollari :
    • Envelope glyphicon: 
    • Print glyphicon: 
    • Search glyphicon: 
    • Download glyphicon: 

    Misol

    • Glyphicon Examples


      Search icon:


      Search icon on a styled button:

      Search



      Download 488.06 Kb.




    Download 488.06 Kb.
    Bosh sahifa
    Aloqalar
        Bosh sahifa
    Dərs
    Mühazirə
    Qaydalar
    Referat
    Xülasə


    Bootstrap bilan responsive web dizayn

    Download 488.06 Kb.