BootstrapCheatsheet

RTL cheatsheet

Mga nilalaman

Typography

Dokumentasyon

Pagpapakita 1

Pagpapakita 2

Pagpapakita 3

Pagpapakita 4

Pagpapakita 5

Pagpapakita 6

Pamagat 1

Pamagat 2

Pamagat 3

Pamagat 4

Pamagat 5

Pamagat 6

Ito ay isang lead na talata. Namumukod-tangi ito sa mga regular na talata.

Maaari mong gamitin ang mark tag sahighlighttext.

Ang linya ng text na ito ay nilalayong ituring bilang tinanggal na text.

Ang linya ng text na ito ay nilalayong ituring na hindi na tumpak.

Ang linya ng text na ito ay nilalayong ituring bilang karagdagan sa dokumento.

Ire-render ang linyang ito ng text bilang may salungguhit.

Ang linya ng text na ito ay nilalayong ituring bilang fine print.

Ang linyang ito ay nai-render bilang naka-bold na teksto.

Ang linyang ito ay nai-render bilang italicized na teksto.

Isang kilalang quote, na nasa isang blockquote na elemento.

Isang taong sikat sa Pamagat ng Pinagmulan
  • Ito ay isang listahan.
  • Ito ay tila ganap na hindi naka-istilo.
  • Sa istruktura, ito ay isang listahan pa rin.
  • Gayunpaman, nalalapat lamang ang istilong ito sa mga kagyat na elemento ng bata.
  • Mga naka-nest na listahan:
    • ay hindi naaapektuhan ng ganitong istilo
    • magpapakita pa rin ng bala
    • at may naaangkop na kaliwang margin
  • Maaari pa rin itong magamit sa ilang sitwasyon.
  • Ito ay isang listahan ng item.
  • At isa pa.
  • Ngunit ipinapakita ang mga ito inline.

Mga imahe

Dokumentasyon
Placeholder Responsive image
A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera 200x200

Mga mesa

Dokumentasyon
# Una Huling Hawakan
1 marka Otto @mdo
2 Jacob Thornton @mataba
3 Larry the Bird @twitter
# Una Huling Hawakan
1 marka Otto @mdo
2 Jacob Thornton @mataba
3 Larry the Bird @twitter
Klase Heading Heading
Default Cell Cell
Pangunahin Cell Cell
Pangalawa Cell Cell
Tagumpay Cell Cell
Panganib Cell Cell
Babala Cell Cell
Impormasyon Cell Cell
Liwanag Cell Cell
Madilim Cell Cell
# Una Huling Hawakan
1 marka Otto @mdo
2 Jacob Thornton @mataba
3 Larry the Bird @twitter

Mga figure

Dokumentasyon
Placeholder 400x300
Isang caption para sa larawan sa itaas.

Mga porma

Pangkalahatang-ideya

Dokumentasyon
Hindi namin kailanman ibabahagi ang iyong email sa sinumang iba pa.
Mga pindutan ng radyo

Mga hindi pinaganang form

Dokumentasyon
Hindi pinagana ang mga radio button

Pagsusukat

Dokumentasyon

Pangkat ng input

Dokumentasyon
@
@example.com
https://example.com/users/
$ .00
Sa textarea

Pagpapatunay

Dokumentasyon
Mukhang maayos!
Mukhang maayos!
@
Mangyaring pumili ng isang username.
Mangyaring magbigay ng wastong lungsod.
Mangyaring pumili ng wastong estado.
Mangyaring magbigay ng wastong zip.
Dapat kang sumang-ayon bago magsumite.

Mga bahagi

Akordyon

Dokumentasyon

Ito ang katawan ng accordion ng unang item. Ito ay nakatago bilang default, hanggang sa idagdag ng collapse plugin ang mga naaangkop na klase na ginagamit namin sa estilo ng bawat elemento. Kinokontrol ng mga klaseng ito ang pangkalahatang hitsura, pati na rin ang pagpapakita at pagtatago sa pamamagitan ng mga transition ng CSS. Maaari mong baguhin ang alinman sa mga ito gamit ang custom na CSS o i-override ang aming mga default na variable. Nararapat ding tandaan na halos anumang HTML ang maaaring pumasok sa loob ng .accordion-body, kahit na nililimitahan ng transition ang overflow.

This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.

Ito ang katawan ng accordion ng ikatlong item. Ito ay nakatago bilang default, hanggang sa idagdag ng collapse plugin ang mga naaangkop na klase na ginagamit namin sa estilo ng bawat elemento. Kinokontrol ng mga klaseng ito ang pangkalahatang hitsura, pati na rin ang pagpapakita at pagtatago sa pamamagitan ng mga transition ng CSS. Maaari mong baguhin ang alinman sa mga ito gamit ang custom na CSS o i-override ang aming mga default na variable. Nararapat ding tandaan na halos anumang HTML ang maaaring pumasok sa loob ng .accordion-body, kahit na nililimitahan ng transition ang overflow.

Mga alerto

Dokumentasyon

Badge

Dokumentasyon

Halimbawang pamagatBago

Halimbawang pamagatBago

Halimbawang pamagatBago

Halimbawang pamagatBago

Halimbawang pamagatBago

Halimbawang pamagatBago

Halimbawang pamagatBago

Halimbawang pamagatBago

Pangunahin Pangalawa Tagumpay Panganib Babala Impormasyon Liwanag Madilim

Mga Pindutan

Dokumentasyon

Card

Dokumentasyon
Placeholder Image cap
Pamagat ng card

Ilang mabilis na halimbawa ng text na ibubuo sa pamagat ng card at bubuo sa karamihan ng nilalaman ng card.

Pumunta sa isang lugar
Itinatampok
Pamagat ng card

Ilang mabilis na halimbawa ng text na ibubuo sa pamagat ng card at bubuo sa karamihan ng nilalaman ng card.

Pumunta sa isang lugar
2 araw ang nakalipas
Pamagat ng card

Ilang mabilis na halimbawa ng text na ibubuo sa pamagat ng card at bubuo sa karamihan ng nilalaman ng card.

  • Isang bagay
  • Ang pangalawang item
  • Pangatlong item
Link ng card Isa pang link
Placeholder Image
Pamagat ng card

Ito ay isang mas malawak na card na may sumusuportang text sa ibaba bilang natural na lead-in sa karagdagang nilalaman. Medyo mas mahaba ang nilalamang ito.

Huling na-update 3 minuto ang nakalipas

Listahan ng pangkat

Dokumentasyon
  • Isang item na hindi pinagana
  • Ang pangalawang item
  • Pangatlong item
  • Pang-apat na item
  • At ang panglima
  • Isang bagay
  • Ang pangalawang item
  • Pangatlong item
  • Pang-apat na item
  • At ang panglima
Isang simpleng default na item ng pangkat ng listahan Isang simpleng pangunahing item ng pangkat ng listahan Isang simpleng pangalawang item ng pangkat ng listahan Isang simpleng item ng pangkat ng listahan ng tagumpay Isang simpleng item ng pangkat ng listahan ng panganib Isang simpleng item ng pangkat ng listahan ng babala Isang simpleng item ng pangkat ng listahan ng impormasyon Isang simpleng light list group item Isang simpleng item ng dark list group

Mga Popover

Dokumentasyon

Scrollspy

Dokumentasyon

Unang heading

Ito ay ilang placeholder na nilalaman para sa scrollspy page. Tandaan na habang nag-i-scroll ka pababa sa pahina, naka-highlight ang naaangkop na link sa pag-navigate. Ito ay paulit-ulit sa buong halimbawa ng bahagi. Patuloy kaming nagdaragdag ng ilang halimbawang kopya dito upang bigyang-diin ang pag-scroll at pag-highlight.

Pangalawang heading

Ito ay ilang placeholder na nilalaman para sa scrollspy page. Tandaan na habang nag-i-scroll ka pababa sa pahina, naka-highlight ang naaangkop na link sa pag-navigate. Ito ay paulit-ulit sa buong halimbawa ng bahagi. Patuloy kaming nagdaragdag ng ilang halimbawang kopya dito upang bigyang-diin ang pag-scroll at pag-highlight.

Pangatlong heading

Ito ay ilang placeholder na nilalaman para sa scrollspy page. Tandaan na habang nag-i-scroll ka pababa sa pahina, naka-highlight ang naaangkop na link sa pag-navigate. Ito ay paulit-ulit sa buong halimbawa ng bahagi. Patuloy kaming nagdaragdag ng ilang halimbawang kopya dito upang bigyang-diin ang pag-scroll at pag-highlight.

Pang-apat na heading

Ito ay ilang placeholder na nilalaman para sa scrollspy page. Tandaan na habang nag-i-scroll ka pababa sa pahina, naka-highlight ang naaangkop na link sa pag-navigate. Ito ay paulit-ulit sa buong halimbawa ng bahagi. Patuloy kaming nagdaragdag ng ilang halimbawang kopya dito upang bigyang-diin ang pag-scroll at pag-highlight.

Ikalimang heading

Ito ay ilang placeholder na nilalaman para sa scrollspy page. Tandaan na habang nag-i-scroll ka pababa sa pahina, naka-highlight ang naaangkop na link sa pag-navigate. Ito ay paulit-ulit sa buong halimbawa ng bahagi. Patuloy kaming nagdaragdag ng ilang halimbawang kopya dito upang bigyang-diin ang pag-scroll at pag-highlight.

Mga Spinner

Dokumentasyon

Mga toast

Dokumentasyon

Mga tooltip

Dokumentasyon