Dagiti Paulo

Amin a paulo ti HTML, <h1>babaen <h6>ket magun-od.

h1. Paulo 1

h2. Paulo 2

h3. Paulo 3

h4. Paulo 4

h5. Paulo 5

h6. Paulo 6

Kopia ti bagi

Ti sangalubongan a default ti Bootstrap font-sizeket 14px , nga addaan iti line-heightti 20px . Mayaplikar daytoy iti <body>ken amin a parapo. Iti pay maipatinayon, dagiti <p>(parapo) ket makaawatda ti baba a margin ti kagudua ti line-height-da (10px babaen ti default).

Nullam quis risus eget urna mollis nga arkos nga vel eu leo. Cum sociis natoque penatibus ken magnis ti panagpasngay a montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies lugan.

Cum sociis natoque penatibus ken magnis ti panagpasngay a montes, nascetur ridiculus mus. Donec ullamcorper nulla nga saan nga auctor nga fringilla. Duis mollis, est non commodo luctus, nisi erat nga porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla nga saan nga auctor nga fringilla.

Maecenas sed diam eget risus varius blandit agtugaw amet saan a magna. Donec id elit nga saan nga mi porta gravida iti eget metus. Duis mollis, est non commodo luctus, nisi erat nga porttitor ligula, eget lacinia odio sem nec elit.

<p> nga ... </p>

Kopia ti bagi ti lead

Pagbalinem a naisangsangayan ti maysa a parapo babaen ti pananginayonmo iti .lead.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus ti dolor ti panagsubasta. Duis mollis, est saan a komodo a luctus.

<p klase = "panangidaulo" > ... </p>

Naibangon iti Basbassit

Ti tipograpiko a sukog ket naibatay kadagiti dua a LESS a variable kadagiti variable.less : @baseFontSizeken @baseLineHeight. Ti umuna ket ti base font-size a nausar iti intero ken ti maikadua ket ti base line-height. Usarenmi dagita a variable ken sumagmamano a simple a matematika tapno mangparnuay kadagiti margin, padding, ken line-heights ti amin a kitami ken dadduma pay. Ipasayaat dagitoy ken makibagay ti Bootstrap.

Pannakaitalmeg

Usaren dagiti default nga emphasis tag ti HTML nga addaan kadagiti nalag-an nga estilo.

`<small>`

Para iti panangikkat iti panangipaganetget iti inline wenno bloke ti teksto, usaren ti bassit nga etiketa.

Daytoy a linia ti teksto ket nairanta a matrato a kas napino a letra.

<p> <small> Daytoy a linia ti teksto ket nairanta a matrato a kas napino a letra. </small> nga </p>

Naingel

Para iti panangipaganetget iti snippet ti teksto nga addaan iti nadagdagsen a font-weight.

Ti sumaganad a snippet ti teksto ket naiparang a kas nalukmeg a teksto .

<strong> naiparang a kas nalukmeg a teksto </strong>

Dagiti Italiko

Para iti panangipaganetget iti maysa a snippet ti teksto nga addaan iti italiko.

Ti sumaganad a snippet ti teksto ket naiparang a kas naitaliko a teksto .

<em> naiparang a kas naitaliko a teksto </em>

Ulo nga agpangato!Marikna a nawaya nga usaren <b>ken <i>iti HTML5. <b>ket nairanta a mangitag-ay kadagiti balikas wenno ragup ti sasao a saan a mangipaay iti kanayonan a kinapateg bayat <i>a kaaduanna ket para iti timek, teknikal a termino, kdpy.

Dagiti klase ti panagtunos

Nalaka nga i-realign ti teksto kadagiti paset nga addaan kadagiti klase ti panagtunos ti teksto.

Naitunos iti kannigid a teksto.

Naitunos iti sentro a teksto.

Kannawan a naitunos a teksto.

<p class = "teksto-kannigid" > Kannigid a naitunos a teksto. </p> 
<p class = "text-center" > Naitunos ti tengnga a teksto. </p> 
<p class = "teksto-kannawan" > Kannawan a naitunos a teksto. </p>

Dagiti klase ti panangipaganetget

Ipakaammo ti kaipapanan babaen ti kolor babaen ti sumagmamano a klase ti utilidad ti panangipaganetget.

Fusce dapibus, tellus ac lunod a komodo, tortor mauris nibh.

Etiam porta sem malesuada nga agtagibalay nga euismod.

Donec ullamcorper nulla nga saan nga auctor nga fringilla.

Aenean nga eu leo quam. Pellentesque nga arkos ti lacinia quam venenatis.

Duis mollis, est saan a komodo a luctus, nisi erat a porttitor a ligula.

<p klase = "naulimek" > Fusce dapibus, tellus ac kursus a komodo, tortor mauris nibh. </p> 
<p klase = "teksto-pakdaar" > Etiam porta sem malesuada magna mollis euismod. </p> 
<p class = "teksto-biddut" > Donec ullamcorper nulla saan a metus auctor fringilla. </p> 
<p klase = "teksto-info" > Enean eu leo quam. Pellentesque nga arkos ti lacinia quam venenatis. </p> 
<p klase = "teksto-balligi" > Duis mollis, est saan a komodo luktus, nisi erat porttitor ligula. </p>

Dagiti abbreviation

Estilo a pannakaipatungpal ti <abbr>elemento ti HTML para kadagiti abbreviation ken acronym tapno maipakita ti napalawa a bersion iti hover. Dagiti abbrevio nga addaan iti titleattribute ket addaan iti nalawag a tulnek a baba a beddeng ken ti kursor ti tulong iti panag-hover, a mangipaay ti kanayonan a konteksto iti panag-hover.

`<abbr>`

Para iti napalawa a teksto iti atiddog a panag-hover ti maysa nga abbreviation, iraman ti titleattribute.

Ti maysa nga abbreviation ti sao nga attribute ket attr .

<abbr title = "kababalin" > attr </abbr>

`<abbr class="initialism">`

Inayon .initialismiti abbreviation para iti basbassit bassit a font-size.

HTML ti kasayaatan a banag sipud idi naiwa a tinapay.

<abbr title = "Panagmarka ti HyperText" class = "inisialismo" > HTML </abbr>

Dagiti Adres

Ipresentar ti impormasion a pakakontakan para iti kaasitgan nga inapo wenno ti intero a bagi ti trabaho.

`<address>`

Ipreserba ti panagpormat babaen ti panangipatingga kadagiti amin a linia iti <br>.

Twitter, Inc.
795 Folsom Ave, Suite 600
San Francisco, CA 94107
P: (123) 456-7890. Ti panagadal ti panagbiag ti tao

Buo a Nagan
[email protected]

<address>
  <strong> Twitter, Inc. </strong><br>
  795 Folsom Ave, Suite 600 nga <br>
  San Francisco, CA 94107 nga <br>
  <abbr titulo = "Telepono" > P: </abbr> (123) 456-7890 
</address>
 
<address>
  <strong> Buo a Nagan </strong><br>
  <a href = "mailto:#" > [email protected] </a> 
</address>

Dagiti sitas ti bloke

Para iti panangadaw kadagiti bloke ti linaon manipud iti sabali a taudan iti uneg ti dokumentom.

Default nga blockquote

Balkoten <blockquote>ti aniaman nga HTML kas quote. Para kadagiti diretso a sitas irekomendarmi ti <p>.

Lorem ipsum dolor agtugaw amet, consectetur adipiscing elit. Integer nga posuere erat a ante.

<blockquote ti panag-block>
  <p> Lorem ipsum dolor agtugaw nga amet, consectetur adipiscing elit. Integer nga posuere erat a ante. </p>
</blockquote ti panagsurat>

Blockquote dagiti pagpilian

Dagiti panagbalbaliw ti estilo ken linaon para kadagiti simple a panagduduma iti maysa a pagalagadan a blockquote.

Panagnagan iti maysa a gubuayan

Inayon ti <small>tag para iti panangilasin ti taudan. Balkoten ti nagan ti taudan nga obra iti <cite>.

Lorem ipsum dolor agtugaw amet, consectetur adipiscing elit. Integer nga posuere erat a ante.
Maysa a nalatak iti Source Title

<blockquote ti panag-block>
  <p> Lorem ipsum dolor agtugaw nga amet, consectetur adipiscing elit. Integer nga posuere erat a ante. </p>
  <small> Maysa a nalatak <cite title = "Paulo ti Gubuayan" > Paulo ti Gubuayan </cite></small> 
</blockquote ti panagsurat>

Agsinnublat dagiti display

Usaren .pull-rightpara iti naitayab, kannawan a naitunos a blockquote.

Lorem ipsum dolor agtugaw amet, consectetur adipiscing elit. Integer nga posuere erat a ante.
Maysa a nalatak iti Source Title

< klase ti blokequote = "guyod-a-kannigid" > 
  ...
</blockquote ti panagsurat>

Dagiti Listaan

Di naurnos

Listaan dagiti banag a saan a nalawag a napateg ti urnos.

Lorem ipsum dolor agtugaw amet
Consectetur nga adipiscing nga elit
Integer nga molestie lorem iti masa
Facilisis iti pretium nisl nga aliquet
Nulla volutpat nga aliquam nga velit
- Phasellus nga iaculis nga neque
- Purus dagiti sodales nga ultricies
- Vestibulum nga laoreet nga porttitor sem
- Ac tristique nga libero nga volutpat ni
Faucibus porta nga lakos nga fringilla vel
Aenean agtugaw amet erat nunc
Eget nga porttitor nga lorem

<ul> nga
  <li> ... </li> nga adda
</ul>

Nabilin

Listaan dagiti banag a ti urnos ket nalawag a napateg.

Lorem ipsum dolor agtugaw amet
Consectetur nga adipiscing nga elit
Integer nga molestie lorem iti masa
Facilisis iti pretium nisl nga aliquet
Nulla volutpat nga aliquam nga velit
Faucibus porta nga lakos nga fringilla vel
Aenean agtugaw amet erat nunc
Eget nga porttitor nga lorem

<ol> nga
  <li> ... </li> nga adda
</ol>

Saan nga estilo

Ikkaten ti default list-styleken kannigid a padding kadagiti banag ti listaan (dagiti dagus nga ubbing laeng).

Lorem ipsum dolor agtugaw amet
Consectetur nga adipiscing nga elit
Integer nga molestie lorem iti masa
Facilisis iti pretium nisl nga aliquet
Nulla volutpat nga aliquam nga velit
- Phasellus nga iaculis nga neque
- Purus dagiti sodales nga ultricies
- Vestibulum nga laoreet nga porttitor sem
- Ac tristique nga libero nga volutpat ni
Faucibus porta nga lakos nga fringilla vel
Aenean agtugaw amet erat nunc
Eget nga porttitor nga lorem

<ul klase = "saan nga estilo" > 
  <li> ... </li> nga adda
</ul>

Inline nga

Ikabil amin a banag ti listaan iti maymaysa a linia nga addaan inline-blockken sumagmamano a nalag-an a padding.

Lorem nga ipsum
Phasellus nga iaculis
Nulla nga volutpat

<ul klase = "inline" > 
  <li> ... </li> nga adda
</ul>

Panangiladawan

Listaan dagiti termino nga addaan kadagiti nainaig a panangiladawan kadagitoy.

Dagiti listaan ti panangiladawan: Ti listaan ti panangiladawan ket perpekto para iti panangdepinar kadagiti termino.
Euismod nga: Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.; Donec id elit nga saan nga mi porta gravida iti eget metus.
Malesuada nga porta: Etiam porta sem malesuada nga agtagibalay nga euismod.

<dl> nga
  <dt> ... </dt> nga adda
  <dd> ... </dd> nga adda
</dl>

Paisaad nga deskripsion

Mangaramid kadagiti termino ken deskripsion nga <dl>agpila nga agkakadua.

Dagiti listaan ti panangiladawan: Ti listaan ti panangiladawan ket perpekto para iti panangdepinar kadagiti termino.
Euismod nga: Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.; Donec id elit nga saan nga mi porta gravida iti eget metus.
Malesuada nga porta: Etiam porta sem malesuada nga agtagibalay nga euismod.
Felis euismod nga semper eget lacinia: Fusce dapibus, tellus ac cursus commodo, tortor mauris kondimentum nibh, ut fermentum masa laeng agtugaw amet risus.

<dl klase = "dl-paisaad" > 
  <dt> ... </dt> nga adda
  <dd> ... </dd> nga adda
</dl>

Ulo nga agpangato!Dagiti horizontal a listaan ti panangiladawan ket mangputed kadagiti termino nga atiddog unay tapno maibagay iti kannigid a panagtarimaan ti kolum text-overflow. Kadagiti akikid a viewport, agbaliwda iti default a naurnong a layout.

Inline nga

Balkoten dagiti inline a snippet ti kodigo babaen ti <code>.

Kas pagarigan, <section>rumbeng a mabalkot kas inline.

Kas pagarigan , <kodigo> & lt ; section & gt ;</ code > ket rumbeng a maibalkot a kas inline .

Basic nga bloke

Usaren <pre>para iti adu a linia ti kodigo. Siguraduen a makalisi iti aniaman a bracket ti anggulo iti kodigo para iti umno a panagiparang.

<p>Pagarigan a teksto ditoy...</p>

<pre> nga
  <p>Pagarigan a teksto ditoy...</p>
</pre>

Ulo nga agpangato!Siguraduen nga agtalinaed ti kodigo iti uneg <pre>dagiti etiketa nga asideg iti kannigid agingga a mabalin; i-renderna amin a tab.

Mabalinmo a pagpilian nga inayon ti .pre-scrollableklase a mangikeddeng ti max-height iti 350px ken mangipaay ti y-axis scrollbar.

Dagiti default nga estilo

Para iti kangrunaan nga estilo—nalag-an a padding ken dagiti laeng horizontal divider—inayonmo ti base class .tableiti aniaman a <table>.

#	Nagan	Apelyido	Nagan ti agar-aramat
1 nga	Marka	Otto ni Otto	@mdo nga
2. 2	Jacob ni Jacob	Thornton nga	@nalukmeg
3.	Larry ni Larry	ti Tumatayab	@twitter nga

< klase ti lamisaan = "lamisaan" > 
  ...
</table>

Opsional a klase

Inayon ti aniaman kadagiti sumaganad a klase iti .tablebatayan a klase.

`.table-striped`

Inayon ti zebra-striping iti ania man a hilera ti lamisaan iti uneg ti <tbody>babaen ti :nth-childCSS selector (saan a magun-od iti IE7-8).

#	Nagan	Apelyido	Nagan ti agar-aramat
1 nga	Marka	Otto ni Otto	@mdo nga
2. 2	Jacob ni Jacob	Thornton nga	@nalukmeg
3.	Larry ni Larry	ti Tumatayab	@twitter nga

< klase ti lamisaan = "lamisaan nga garitgaritan" > 
  ...
</table>

`.table-bordered`

Inayon dagiti beddeng ken nagtimbukel a suli iti lamisaan.

#	Nagan	Apelyido	Nagan ti agar-aramat
1 nga	Marka	Otto ni Otto	@mdo nga
1 nga	Marka	Otto ni Otto	@getbootstrap nga
2. 2	Jacob ni Jacob	Thornton nga	@nalukmeg
3.	Larry ti Tumatayab		@twitter nga

< clase ti lamisaan = "lamisaan-nabeddengan" > 
  ...
</table>

`.table-hover`

Pagbalinen ti estado ti hover kadagiti hilera ti lamisaan iti uneg ti <tbody>.

#	Nagan	Apelyido	Nagan ti agar-aramat
1 nga	Marka	Otto ni Otto	@mdo nga
2. 2	Jacob ni Jacob	Thornton nga	@nalukmeg
3.	Larry ti Tumatayab		@twitter nga

< klase ti lamisaan = "lamisaan-a-hover" > 
  ...
</table>

`.table-condensed`

Pagbalinenna dagiti lamisaan nga ad-adda a kompakto babaen ti panangputedna iti cell padding iti kagudua.

#	Nagan	Apelyido	Nagan ti agar-aramat
1 nga	Marka	Otto ni Otto	@mdo nga
2. 2	Jacob ni Jacob	Thornton nga	@nalukmeg
3.	Larry ti Tumatayab		@twitter nga

< klase ti lamisaan = "lamisaan-napaababa" > 
  ...
</table>

Opsional a klase ti hilera

Usaren dagiti klase ti konteksto tapno mangkolor kadagiti hilera ti lamisaan.

Klase	Panangiladawan
`.success`	Ipamatmatna ti naballigi wenno positibo nga aramid.
`.error`	Ipamatmatna ti napeggad wenno mabalin a negatibo nga aramid.
`.warning`	Ipamatmatna ti pakdaar a mabalin a kasapulan ti atension.
`.info`	Nausar a kas alternatibo kadagiti default nga estilo.

#	Produkto	Bayad nga Naala	Estado
1 nga	TB - Binulan nga	01/04/2012 nga aldaw	Naaprubaran
2. 2	TB - Binulan nga	02/04/2012 nga aldaw	Nagkedked
3.	TB - Binulan nga	03/04/2012 nga aldaw	Naisardeng biit
4.	TB - Binulan nga	04/04/2012 nga aldaw	Tawagan ti sumrek tapno makumpirmar

...
  < tr klase = "balligi" >
    <td> 1 < /td> nga
    <td>TB - Binulan</ td >
    <td> 01 / 04 / 2012 nga aldaw < /td>
    <td>Naaprobaran</ td >
  </ tr >
...

Nasuportaran ti panagmarka ti lamisaan

Listaan dagiti nasuportaran nga elemento ti HTML ti lamisaan ken no kasano a rumbeng nga usaren dagitoy.

Nailaktip	Panangiladawan
`<table>`	Element ti panagbalkot para iti panangiparang ti datos iti pormat ti tabular
`<thead>`	Elemento ti pagkargaan para kadagiti hilera ti ulo ti lamisaan ( `<tr>`) tapno mangimarka kadagiti adigi ti lamisaan
`<tbody>`	Elemento ti pagkargaan para kadagiti hilera ti lamisaan ( `<tr>`) iti bagi ti lamisaan
`<tr>`	Elemento ti pagkargaan para iti maysa a grupo dagiti selula ti lamisaan ( `<td>`wenno `<th>`) nga agparang iti maymaysa a linia
`<td>`	Default a selula ti lamisaan
`<th>`	Espesial a selula ti lamisaan para kadagiti etiketa ti kolum (wenno hilera, depende iti sakup ken pannakaikabil).
`<caption>`	Panangdeskribir wenno pakagupgopan no ania ti iggem ti lamisaan, nangnangruna a makatulong kadagiti agbasbasa iti iskrin

<lamisaan>
  <kapsion> ... </kapsion>
  <ulo>
    <tr> nga
      <th> ... </th> nga adda
      <th> ... </th> nga adda
    </tr>
  </tulo>
  <tibagi>
    <tr> nga
      <td> ... </td> nga adda
      <td> ... </td> nga adda
    </tr>
  </tbagi>
</table>

Dagiti default nga estilo

Dagiti indibidual a kontrol ti porma ket umawatda ti estilo, ngem awan ti ania man a kasapulan a batayan a klase iti <form>wenno dagiti dadakkel a panagbalbaliw iti marka. Agresulta kadagiti naurnong, kannigid-a-naitunos nga etiketa iti rabaw dagiti kontrol ti porma.

<porma>
  <set ti tay-ak>
    <leyenda> Sarita </leyenda>
    <label> Nagan ti etiketa </label>
    <input type = "teksto" placeholder = "Isurat ti maysa a banag..." >  
    <span class = "help-block" > Pagarigan ti teksto ti tulong iti lebel ti bloke ditoy. </span> 
    < klase ti etiketa = "kahon ti tsek" > 
      <input type = "kahon ti tsek" > Kitaennak 
    </label>
    <button type = "ipatuloden" klase = "btn" > Isumite </button>  
  </fieldset ti tay-ak>
</porma>

Dagiti opsional a layout

Nairaman iti Bootstrap ti tallo nga opsional a layout ti porma para kadagiti gagangay a kaso ti panagusar.

Pormas ti panagsapul

Inayon .form-searchiti porma ken .search-queryiti <input>para iti ekstra-natimbukel a panagserrek ti teksto.

< klase ti porma = "porma-a-panagbiruk" > 
  <input type = "teksto" klase = "input-medium a panagsaludsod-a-panagsaludsod" >  
  <button type = "ipatulod" klase = "btn" > Agbiruk </button>  
</porma>

Inline nga porma

Inayon .form-inlinepara kadagiti kannigid-a-naitunos nga etiketa ken dagiti inline-block a kontrol para iti kompakto a layout.

< klase ti porma = "porma-inline" > 
  < tipo ti panagserrek = "teksto" klase = "panagserrek-bassit" a pagtengngel ti lugar = "Email" >   
  <input type = "password" class = "input-bassit" nga lugar = "Password" >   
  < klase ti etiketa = "kahon ti tsek" > 
    <input type = "checkbox" > Laglagipennak 
  </label>
  <button type = "ipatulod" klase = "btn" > Agpirma </button>  
</porma>

Paisaad a porma

Kannawan nga i-align dagiti etiketa ken i-flow dagitoy iti kannigid tapno agparang dagitoy iti isu met laeng a linia a kas kadagiti kontrol. Kasapulan ti kaaduan a panagbalbaliw ti marka manipud iti default a porma:

Inayon .form-horizontaliti porma
Balkoten dagiti etiketa ken kontrol iti.control-group
Inayon .control-labeliti etiketa
Balkoten ti aniaman a nainaig a kontrol .controlspara iti umno a panagtunos

< klase ti porma = "porma-paisaad" > 
  <div klase = "grupo-a-kontrol" > 
    <label class = "kontrol-etiketa" para iti = "inputEmail" > Email </label>  
    <div klase = "dagiti kontrol" > 
      < tipo ti panagserrek = "teksto" id = "Email ti panagserrek" ti lugar = "Email" >   
    </div>
  </div>
  <div klase = "grupo-a-kontrol" > 
    <label class = "kontrol-etiketa" para iti = "inputPassword" > Kontrasenias </label>  
    <div klase = "dagiti kontrol" > 
      < tipo ti panagserrek = "kontrasenias" id = "Password ti panagserrek" placeholder = "Kontrasenias" >   
    </div>
  </div>
  <div klase = "grupo-a-kontrol" > 
    <div klase = "dagiti kontrol" > 
      < klase ti etiketa = "kahon ti tsek" > 
        <input type = "checkbox" > Laglagipennak 
      </label>
      <button type = "ipatulod" klase = "btn" > Agpirma </button>  
    </div>
  </div>
</porma>

Nasuportaran dagiti kontrol ti porma

Dagiti pagarigan dagiti pagalagadan a kontrol ti porma a nasuportaran iti maysa a pagarigan a layout ti porma.

Dagiti Input

Kaaduan a gagangay a panangtengngel ti porma, dagiti tay-ak ti panagserrek a naibatay iti teksto. Iramanna ti suporta para kadagiti amin a kita ti HTML5: teksto, password, oras ti petsa, oras ti petsa-lokal, petsa, bulan, oras, lawas, numero, email, url, panagbiruk, tel, ken kolor.

Kasapulan ti panagusar iti naikeddeng typeiti amin a tiempo.

< tipo ti panagserrek = "teksto" placeholder = "Panagserrek ti teksto" >

Lugar ti Teksto

Kontrol ti porma a mangsuporta iti adu a linia ti teksto. Baliwan ti rowsattribute no kasapulan.

<dagiti hilera ti lugar ti teksto = "3" ></lugar ti teksto>

Dagiti checkbox ken radio

Dagiti kahon ti tsek ket para iti panagpili ti maysa wenno sumagmamano a pagpilian iti maysa a listaan bayat a dagiti radio ket para iti panagpili ti maysa a pagpilian manipud iti adu.

Default (naurnong) .

< klase ti etiketa = "kahon ti tsek" > 
  < tipo ti input = "kahon ti tsek" pateg = "" >  
  Ti umuna a pagpilian ket daytoy ken dayta—siguraduenyo nga iraman no apay a nagsayaat dayta
</label>
 
< klase ti etiketa = "radio" > 
  <input type = "radio" name = "dagiti pagpilianRadio" id = "dagiti pagpilianRadio1" pateg = "pagpilian1" a nasukimaten >     
  Ti umuna a pagpilian ket daytoy ken dayta—siguraduenyo nga iraman no apay a nagsayaat dayta
</label>
< klase ti etiketa = "radio" > 
  < tipo ti input = "radio" nagan = "dagiti pagpilianRadio" id = "dagiti pagpilianRadio2" pateg = "pagpilian2" >    
  Ti pagpilian dua ket mabalin a sabali ken ti panangpili iti dayta ket mangikkat iti pagpilian iti maysa
</label>

Inline dagiti kahon ti tsek

Inayon ti .inlineklase iti serye dagiti checkbox wenno radio para kadagiti kontrol agparang iti isu met laeng a linia.

< klase ti etiketa = "kahon ti tsek iti inline" > 
  < tipo ti input = "kahon ti tsek" id = "inlineCheckbox1" pateg = "pagpilian1" > 1   
</label>
< klase ti etiketa = "kahon ti tsek iti inline" > 
  < tipo ti input = "kahon ti tsek" id = "inlineCheckbox2" pateg = "pagpilian2" > 2   
</label>
< klase ti etiketa = "kahon ti tsek iti inline" > 
  < tipo ti input = "kahon ti tsek" id = "inlineCheckbox3" pateg = "pagpilian3" > 3   
</label>

Pilien ti

Usaren ti default a pagpilian wenno ikeddeng ti a multiple="multiple"tapno maminsan nga ipakita ti adu a pagpilian.

<pilien>
  <pagpilian> 1 </pagpipilian>
  <pagpilian> 2 </pagpipilian>
  <pagpilian> 3 </pagpipilian>
  <pagpilian> 4 </pagpipilian>
  <pagpilian> 5 </pagpipilian>
</pilien ti>
 
<pilien ti adu = "adu" > 
  <pagpilian> 1 </pagpipilian>
  <pagpilian> 2 </pagpipilian>
  <pagpilian> 3 </pagpipilian>
  <pagpilian> 4 </pagpipilian>
  <pagpilian> 5 </pagpipilian>
</pilien ti>

Panangpalawa kadagiti kontrol ti porma

Iti pananginayon iti rabaw dagiti addan a kontrol ti browser, ti Bootstrap ket mangiraman kadagiti dadduma pay a makatulong a paset ti porma.

Nasaksakbay ken naikapet nga inputs

Manginayon ti teksto wenno buton sakbay wenno kalpasan ti aniaman a teksto-based input. Do note nga dagiti selectelemento ket saan a nasuportaran ditoy.

Dagiti default a pagpilian

Balkoten ti an .add-onken an inputiti maysa kadagiti dua a klase tapno mai-prepend wenno mainayon ti teksto iti maysa nga input.

<div klase = "panangserrek-a-prepend" > 
  <span klase = "nainayon" > @ </span> 
  < klase ti panagserrek = "span2" id = "prependedInput" a kita = "teksto" ti lugar = "Nagan ti agar-aramat" >    
</div>
<div klase = "input-i-append" > 
  < klase ti input = "span2" id = "naikapet ngaInput" tipo = "teksto" >   
  <span klase = "nainayon" > .00 </span> 
</div>

Nagtipon

Usaren ti agpada a klase ken dua nga instansia ti .add-ontapno prepend ken i-append ti maysa nga input.

<div class = "panangserrek-prepend input-inayon" > 
  <span klase = "nainayon" > $ </span> 
  < klase ti panagserrek = "span2" id = "naikapetNaidatag nga Input" tipo = "teksto" >   
  <span klase = "nainayon" > .00 </span> 
</div>

Butones imbes a teksto

Imbes nga a <span>with text, usaren ti a .btntapno maikapet ti maysa a buton (wenno dua) iti maysa nga input.

<div klase = "input-i-append" > 
  < klase ti panagserrek = "span2" id = "naikapet a Buton ti Input" tipo = "teksto" >   
  < klase ti buton = "btn" tipo = "buton" > Mapan! </button> nga  
</div>

<div klase = "input-i-append" > 
  < klase ti panagserrek = "span2" id = "naikapet a Butones ti Input" tipo = "teksto" >   
  <buton klase = "btn" tipo = "buton" > Agbirok </button>  
  < klase ti buton = "btn" tipo = "buton" > Dagiti Pagpilian </button>  
</div>

Dagiti dropdown ti buton

<div klase = "input-i-append" > 
  < klase ti panagserrek = "span2" id = "naikapet aDropdownButton" tipo = "teksto" >   
  <div klase = "btn-grupo" > 
    < klase ti buton = "btn dropdown-toggle" panagbalbaliw -datos = "pababa" >  
      Aksion
      <span klase = "caret" </span> 
    </button> nga
    <ul klase = "nababa-a-menu" > 
      ...
    </ul>
  </div>
</div>

<div klase = "panangserrek-a-prepend" > 
  <div klase = "btn-grupo" > 
    < klase ti buton = "btn dropdown-toggle" panagbalbaliw -datos = "pababa" >  
      Aksion
      <span klase = "caret" </span> 
    </button> nga
    <ul klase = "nababa-a-menu" > 
      ...
    </ul>
  </div>
  < klase ti panagserrek = "span2" id = "nasaksakbay aDropdownButton" tipo = "teksto" >   
</div>

<div class = "panangserrek-prepend input-inayon" > 
  <div klase = "btn-grupo" > 
    < klase ti buton = "btn dropdown-toggle" panagbalbaliw -datos = "pababa" >  
      Aksion
      <span klase = "caret" </span> 
    </button> nga
    <ul klase = "nababa-a-menu" > 
      ...
    </ul>
  </div>
  < klase ti panagserrek = "span2" id = "naikapetNaisaganaDropdownButton" tipo = "teksto" >   
  <div klase = "btn-grupo" > 
    < klase ti buton = "btn dropdown-toggle" panagbalbaliw -datos = "pababa" >  
      Aksion
      <span klase = "caret" </span> 
    </button> nga
    <ul klase = "nababa-a-menu" > 
      ...
    </ul>
  </div>
</div>

Nabingaybingay dagiti dropdown a grupo

<porma>
  <div klase = "panangserrek-a-prepend" > 
    <div klase = "btn-grupo" > ... </div> 
    < tipo ti input = "teksto" > 
  </div>
  <div klase = "input-i-append" > 
    < tipo ti input = "teksto" > 
    <div klase = "btn-grupo" > ... </div> 
  </div>
</porma>

Pormas ti panagsapul

< klase ti porma = "porma-a-panagbiruk" > 
  <div klase = "input-i-append" > 
    < tipo ti input = "teksto" klase = "span2 a panagsapul-a-saludsod" >  
    <button type = "ipatulod" klase = "btn" > Agbiruk </button>  
  </div>
  <div klase = "panangserrek-a-prepend" > 
    <button type = "ipatulod" klase = "btn" > Agbiruk </button>  
    < tipo ti input = "teksto" klase = "span2 a panagsapul-a-saludsod" >  
  </div>
</porma>

Kontrolado ti panagdakkel

Usaren dagiti relatibo a klase ti panagdakkel a kas .input-largewenno maipada dagiti inputmo kadagiti kadakkel ti adigi ti grid babaen ti panagusar kadagiti .span*klase.

Dagiti input ti lebel ti bloke

Aramiden ti ania man <input>wenno <textarea>elemento nga agtignay a kas ti elemento ti lebel ti bloke.

< klase ti iseserrek = "nga-angin-a-blok-ti-input" a kita = "teksto" a pagsaadan ti lugar = ".nga-angin-a-blok-a-pannakaserrek" >

Relatibo a panagdakkel

< klase ti input = "input-mini" a kita = "teksto" a pagikabilan ti lugar = ".input-mini" >   
< klase ti input = "input-bassit" tipo = "teksto" placeholder = ".input-bassit" >   
< klase ti panagserrek = "panagserrek-a-medium" tipo = "teksto" a pagtengngel ti lugar = ".input-medium" >   
< klase ti iseserrek = "dakkel ti iseserrek" tipo = "teksto" placeholder = ".dakkel ti iseserrek" >   
< klase ti input = "input-xlarge" tipo = "teksto" placeholder = ".input-xlarge" >   
< klase ti input = "input-xxlarge" tipo = "teksto" placeholder = ".input-xxlarge" >

Ulo nga agpangato!Kadagiti masakbayan a bersion, baliwanmi ti panagusar kadagitoy a relatibo a klase ti panagserrek tapno maipada kadagiti kadakkel ti butonmi. Kas pagarigan, .input-largepaaduenna ti padding ken font-size ti maysa nga input.

Panagdakkel ti grid

Usaren .span1ti to .span12para kadagiti input a maipada kadagiti agpapada a kadakkel dagiti adigi ti grid.

< klase ti panagserrek = "span1" a kita = "teksto" a pagsaadan = " .span1 " >   
< klase ti panagserrek = "span2" a kita = "teksto" a pagsaadan = " .span2 " >   
< klase ti panagserrek = "span3" a kita = "teksto" a pagsaadan = " .span3 " >   
<pilien ti klase = "span1" > 
  ...
</pilien ti>
<pilien ti klase = "span2" > 
  ...
</pilien ti>
<pilien ti klase = "span3" > 
  ...
</pilien ti>

Para kadagiti adu a grid input iti tunggal maysa a linia, usaren ti .controls-rowklase ti mangbalbaliw para iti umno nga espasyo . Daytoy ket agtaytayab kadagiti input tapno ag-collapse ti white-space, mangikeddeng kadagiti umno a margin, ken mangikkat ti float.

<div klase = "dagiti kontrol" > 
  < klase ti panagserrek = "span5" a kita = "teksto" a pagsaadan = " .span5 " >   
</div>
<div class = "dagiti kontrol dagiti kontrol-hilera" > 
  < klase ti panagserrek = "span4" a kita = "teksto" a pagtakderan = " .span4 " >   
  < klase ti panagserrek = "span1" a kita = "teksto" a pagsaadan = " .span1 " >   
</div>
...

Dagiti di ma-edit nga input

Ipresentar ti datos iti porma a saan a ma-edit no saan nga agusar ti aktual a marka ti porma.

<span class = "input-xlarge uneditable-input" > Sumagmamano a pateg ditoy </span>

Pormaen dagiti tignay

Pagpatinggaen ti maysa a porma babaen ti maysa a grupo dagiti tignay (buttons). No maikabil iti uneg ti .form-actions, dagiti buton ket automatiko nga ag-indent tapno aglinya kadagiti kontrol ti porma.

<div class = "porma-dagiti tignay" > 
  <button type = "ipatulod" class = "btn btn-primary" > Idulin dagiti panagbalbaliw </button>  
  < tipo ti buton = "buton" klase = "btn" > Kanselaen </button>  
</div>

Teksto ti tulong

Inline ken suporta ti lebel ti bloke para iti teksto ti tulong nga agparang iti aglawlaw dagiti kontrol ti porma.

Tulong iti inline

<input type = "teksto" ><span class = "tulong-inline" > Teksto ti tulong iti uneg ti linia </span>

I-block ti tulong

<input type = "text" ><span class = "help-block" > Ti at-atiddog a bloke ti teksto ti tulong a mangburak iti baro a linia ken mabalin nga agsaknap iti labes ti maysa a linia. </span>

Porma dagiti estado ti panangkontrol

Mangted ti feedback kadagiti agar-aramat wenno bisita nga addaan kadagiti batayan nga estado ti feedback kadagiti kontrol ti porma ken dagiti etiketa.

I-put ti pokus

Ikkatenmi dagiti default outlinenga estilo kadagiti sumagmamano a kontrol ti porma ken iyaplikarmi ti box-shadowa iti lugarna para iti :focus.

<input class = "input-xlarge" id = "naipamaysaInput" type = "teksto" pateg = "Daytoy ket naipamaysa..." >

Di umiso nga input

Dagiti panagserrek ti estilo babaen ti default a panagusar ti browser nga addaan iti :invalid. Ibaga ti a type, inayon ti requiredattribute no ti tay-ak ket saan a pagpilian, ken (no maipakat) ikeddeng ti maysa a pattern.

Daytoy ket saan a magun-od kadagiti bersion ti Internet Explorer 7-9 gapu ti kaawan ti suporta para kadagiti CSS a pseudo a managpili.

< klase ti input = "span3" a kita = " kasapulan ti email" >

Dagiti baldado nga input

Inayon ti disabledattribute iti maysa nga input tapno malapdan ti panagserrek ti agar-aramat ken mangtignay ti naiduma bassit a langa.

<input class = "input-xlarge" id = "disabledInput" type = "teksto" placeholder = "Nabaldado ti panagserrek ditoy..." nabaldado >

Kuna ti panangipaneknek

Ti Bootstrap ket mangiraman kadagiti estilo ti panangipaneknek para kadagiti mensahe ti biddut, pakdaar, impormasion, ken balligi. Tapno mausar, inayon ti maitutop a klase iti aglawlaw .control-group.

<div class = "pakdaar ti grupo-ti-kontrol" > 
  <label class = "kontrol-etiketa" para iti = "inputWarning" > Iserrek nga addaan pakdaar </label>  
  <div klase = "dagiti kontrol" > 
    < tipo ti input = "teksto" id = "Pakdaar ti input" >  
    <span class = "help-inline" > Mabalin nga adda nagbiddut </span> 
  </div>
</div>
 
<div class = "biddut ti kontrol-grupo" > 
  <label class = "kontrol-etiketa" para iti = "inputError" > Iserrek nga addaan iti biddut </label>  
  <div klase = "dagiti kontrol" > 
    < tipo ti panagserrek = "teksto" id = "Biddut ti panagserrek" >  
    <span class = "help-inline" > Pangngaasi nga ilinteg ti biddut </span> 
  </div>
</div>
 
<div class = "ipakaammo ti kontrol-grupo" > 
  <label class = "kontrol-etiketa" para iti = "inputInfo" > Iserrek nga addaan iti impormasion </label>  
  <div klase = "dagiti kontrol" > 
    < tipo ti panagserrek = "teksto" id = "Impormasion ti panagserrek" >  
    <span class = "help-inline" > Ti nagan ti agar-aramat ket naaladan </span> 
  </div>
</div>
 
<div class = "balligi ti kontrol-grupo" > 
  <label class = "kontrol-etiketa" para iti = "inputSuccess" > Iserrek nga addaan balligi </label>  
  <div klase = "dagiti kontrol" > 
    < tipo ti panagserrek = "teksto" id = "Bballigi ti panagserrek" >  
    <span class = "tulong-inline" > Woohoo! </span> 
  </div>
</div>

Dagiti default a buton

Dagiti estilo ti buton ket mabalin a mayaplikar iti ania man nga addaan ti .btnklase a naipakat. Nupay kasta, kadawyan a kayatmo nga iyaplikar dagitoy iti laeng <a>ken <button>dagiti elemento para iti kasayaatan a panagiparang.

Buton	klase=""	Panangiladawan
	`btn`	Standard nga abuabu nga buton nga may gradient
	`btn btn-primary`	Mangipaay ti ekstra a makita a dagsen ken mangilasin ti kangrunaan nga aramid iti maysa a grupo dagiti buton
	`btn btn-info`	Nausar a kas alternatibo kadagiti default nga estilo
	`btn btn-success`	Ipamatmatna ti naballigi wenno positibo nga aramid
	`btn btn-warning`	Ipamatmatna a rumbeng a maaramid ti panagannad iti daytoy nga aramid
	`btn btn-danger`	Ipamatmatna ti napeggad wenno mabalin a negatibo nga aramid
	`btn btn-inverse`	Agsinnublat a natayengteng nga abuabu a buton, saan a naigalut iti semantiko nga aramid wenno panagusar
	`btn btn-link`	Ipaganetgetmo unay ti maysa a buton babaen ti panangaramidmo iti dayta a kasla silpo bayat a taginayonem ti kababalin ti buton

Krus ti panagtunos ti browser

Ti IE9 ket saan a mang-crop kadagiti background gradient kadagiti nagtimbukel a suli, isu nga ikkatenmi daytoy. Mainaig, ti IE9 ket mang-janify kadagiti baldado buttonnga elemento, a mangiparang ti teksto nga abuabu nga addaan iti naalas a teksto-anniniwan a ditay mabalin nga ilinteg.

Dagiti kadakkel ti buton

Magarbo a dakdakkel wenno basbassit a butones? Inayon ti .btn-large, .btn-small, wenno .btn-minipara kadagiti kanayonan a kadakkel.

<p> nga
  <button class = "btn btn-dakkel a btn-pangruna" type = "button" > Dakkel a buton </button>  
  <button class = "btn btn-dakkel" tipo = "buton" > Dakkel a buton </button>  
</p>
<p> nga
  < klase ti buton = "btn btn-primary" tipo = "buton" > Buton ti kasisigud </button>  
  <buton klase = "btn" tipo = "buton" > Buton ti kasisigud </button>  
</p>
<p> nga
  <buton klase = "btn btn-bassit a btn-pangruna" tipo = "buton" > Bassit a buton </button>  
  <buton klase = "btn btn-bassit" tipo = "buton" > Bassit a buton </button>  
</p>
<p> nga
  < klase ti buton = "btn btn-mini btn-pangruna" tipo = "buton" > Mini buton </buton>  
  < klase ti buton = "btn btn-mini" tipo = "buton" > Mini buton </buton>  
</p>

Mangaramid kadagiti buton ti block level—dagidiay mangsaklaw iti naan-anay a kalawa ti maysa a nagannak— babaen ti pananginayon iti .btn-block.

<buton klase = "btn btn-dakkel a btn-blok btn-pangruna" tipo = "buton" > Buton ti lebel ti bloke </button>  
<button class = "btn btn-dakkel a btn-block" tipo = "button" > Buton ti lebel ti bloke </button>

Kasasaad ti baldado

Pagbalinen a kasla saan a mai-click dagiti buton babaen ti panangikusna kadakuada iti 50%.

Angkla nga elemento

Inayon ti .disabledklase kadagiti <a>buton.

Panguna a silpo Inaig

<a href = "#" class = "btn btn-dakkel a btn-pangruna a nabaldado" > Panguna a silpo </a>  
<a href = "#" klase = "btn btn-dakkel a nabalbaliwan" > Silpo </a>

Ulo nga agpangato!Usarenmi a .disabledkas maysa a klase ti utilidad ditoy, a kapada ti gagangay a .activeklase, isu nga awan ti kasapulan a pangrugian. Kasta met, daytoy a klase ket para laeng iti estetika; masapul nga usarem ti kostumbre a JavaScript tapno mapasardeng dagiti silpo ditoy.

Elemento ti buton

Inayon ti disabledattribute kadagiti <button>buton.

<button type = "button" class = "btn btn-dakkel a btn-pangruna a nabalbaliwan" nabalbaliwan = "nabaldado" > Panguna a buton </button>   
< kita ti buton = "buton" klase = "btn btn-dakkel" nabaldado > Buton </buton>

Maysa a klase, adu a tag

Usaren ti .btnklase iti maysa a <a>, <button>, wenno <input>elemento.

<a klase = "btn" href = "" > Silpo </a>  
<buton klase = "btn" tipo = "ipatulod" > Buton </buton>  
< klase ti panagserrek = "btn" a kita = "buton" a pateg = "Panagserrek" >   
< klase ti panagserrek = "btn" tipo = "ipatuloden" pateg = "Isubmitir" >

Kas ti kasayaatan nga aramid, padasem nga ipada ti elemento para iti kontekstomo tapno masigurado ti panagtunos ti panagiparang ti krus-browser. No addaanka iti input, usarem ti <input type="submit">para iti butonmo.

Inayon dagiti klase iti maysa nga <img>elemento tapno nalaka nga estilo dagiti ladawan iti ania man a proyekto.

<img src = "..." klase = "img-natimbukel" >  
<img src = "..." klase = "img-sirkulo" >  
<img src = "..." klase = "img-polaroid" >

Ulo nga agpangato! .img-roundedken .img-circlesaan nga agtrabaho iti IE7-8 gapu iti kaawan ti border-radiussuporta.

Dagiti glifo nga ikono

140 nga ikono iti porma ti sprite, a magun-od iti natayengteng nga abuabu (default) ken puraw, nga inted babaen ti Glyphicons .

icon-sarming nga
ikono-musika
icon-panagsapul
icon-sobre nga
icon-puso nga
icon-bituen
icon-bituen-empty
icon-nga agus-usar
ikono-pelikula
icon-maika-dakkel
icon-th
icon-ti-listaan
icon-ok nga
icon-ikkaten
ikono-ti-panag-zoom
ikono-a-panag-zoom-out
icon-off nga
ikono-senyales
icon-cog nga
icon-basuraan
icon-pagtaengan
icon-file nga
icon-panawen
ikono-dalan
ikono-i-download-alt
icon-i-download
icon-i-upload
ikono-inbox
icon-play-a-sirkulo
icon-uliten
ikono-pabaro
ikono-listaan-alt
ikono-kandado
icon-bandera nga
dagiti ikono-headphone
icon-tomo-a-naiddep
icon-tomo-nga-agpababa
ikono-tomo-nga-up
ikono-qrcode nga
ikono-barcode nga
ikono-ti-tag
dagiti icon-tag
icon-libro
icon-marka ti libro
ikono-i-print
ikono-kamera
ikono-a-letra
icon-bold nga
ikono-italiko nga
ikono-teksto-kangato
ikono-teksto-kalawa
ikono-agtunos-kannigid
icon-align-a-sentro
ikono-agtunos-kannigid
icon-align-ikalintegan
ikono-listaan
ikono-indent-kannigid
ikono-indent-kannigid
icon-rupa-panawen-video
icon-ladawan
icon-lapis nga
ikono-mapa-marker
ikono-i-adjust
icon-tint nga
ikono-urnosen
ikono-ibinglay
ikono-sukimat
ikono-iyakar
icon-addang-nga agpaatras
icon-napartak-nga agpaatras
icon-nga agpalikud
icon-play nga
icon-pause ti panagsardeng
ikono-panagsardeng
icon-agpasango
icon-napartak-nga-agpasango
icon-addang-nga-agpasango
ikono-i-eject
ikono-chevron-kannigid
ikono-chevron-kannigid
icon-plus-a-pagilasinan
icon-minus-a-pagilasinan
icon-ikkaten-a-pagilasinan
icon-ok-a-pagilasinan
icon-saludsod-a-pagilasinan
icon-info-a-pagilasinan
ikono-i-screenshot
icon-ikkaten-ti-sirkulo
ikono-ok-sirkulo nga
ikono-ban-a-sirkulo
icon-pana-kannigid
icon-pana-kannigid
icon-pana-nga-nga-ngato
icon-pana-nga-pababa
ikono-ibinglay-alt
icon-a-padakkel-a-napno
icon-baliwan ti kadakkel-bassit
icon-plus nga
ikono-minus nga
icon-asterisko nga
icon-pag-exclamation-a-pagilasinan
icon-regalo nga
icon-bulong nga
icon-apuy nga
icon-mata-a-luktan
icon-mata-a-asideg
icon-pakdaar-a-pagilasinan
icon-plano nga
ikono-kalendario
icon-random nga
ikono-komento
ikono-imán nga
ikono-chevron-nga-nga-up
ikono-chevron-nga agpababa
ikono-ti-retweet
icon-kariton ti panaggatang
ikono-ti-folder-a-serraan
icon-folder-a-luktan
ikono-baliwan ti kadakkel-a-bertikal
ikono-baliwan ti kadakkel-paisaad
ikono-hdd nga
ikono-bullhorn nga
ikono-kampana
icon-sertipiko nga
icon-a-dama nga agpangato
icon-a-dama nga agpababa
icon-ima-kannawan
icon-ima-kannigid
icon-i-ima-nga-up
icon-ima-nga-ibaba
icon-sirkulo-pana-kannawan
icon-sirkulo-pana-kannigid
icon-sirkulo-pana-nga-nga-ngato
icon-sirkulo-pana-nga-agpababa
ikono-globo nga
icon-lave nga
icon-dagiti trabaho
icon-a pagsala
icon-malettina nga
icon-a naan-anay nga iskrin

Glyphicons nga atribusion

Dagiti Glyphicons Halflings ket gagangay a saan a magun-od a libre, ngem ti maysa nga urnos iti nagbaetan ti Bootstrap ken dagiti agparpartuat ti Glyphicons ket nangaramid daytoy a posible nga awan ti gastos kenka a kas dagiti agparparang-ay. Kas panagyaman, kiddawenmi nga iramanmo ti opsional a silpo nga agsubli iti Glyphicons kaanoman a praktikal.

No kasano nga usaren

Amin nga ikono ket agkasapulan ti <i>etiketa nga addaan iti naisangayan a klase, a nasaksakbay iti icon-. Tapno mausar, ikabilmo ti sumaganad a kodigo iti dandani sadinoman:

<i klase = "ikono-panagbiruk" </i>

Adda met dagiti estilo a magun-odan para kadagiti nabaliktad (puraw) nga ikono, a naaramid a nakasagana nga addaan iti maysa nga ekstra a klase. Espesipiko nga ipatungpalmi daytoy a klase kadagiti hover ken aktibo nga estado para kadagiti nav ken dropdown a silpo.

<i class = "ikono-agbirok ti ikono-puraw" ></i>

Ulo nga agpangato!No agus-usar kadagiti abay dagiti kuerdas ti teksto, a kas kadagiti buton wenno dagiti silpo ti nav, siguraduen a mangibati ti espasyo kalpasan ti <i>etiketa para iti umno a panagsisina.

Dagiti pagarigan ti icon

Usaren dagitoy kadagiti buton, grupo ti buton para iti toolbar, nabigasion, wenno dagiti prepended a panagserrek ti porma.

Dagiti Buton

Grupo ti buton iti maysa a toolbar ti buton

<div klase = "btn-a baras ti ramit" > 
  <div klase = "btn-grupo" > 
    <a klase = "btn" href = "#" ><i klase = "ikono-a-tunos-kannigid" ></i></a>   
    <a klase = "btn" href = "#" ><i klase = "ikon-a-tunos-a-sentro" ></i></a>   
    <a klase = "btn" href = "#" ><i klase = "ikono-a-tunos-kannigid" ></i></a>   
    <a klase = "btn" href = "#" ><i klase = "ikon-itunos-ti-ikalintegan" ></i></a>   
  </div>
</div>

Dropdown iti maysa a grupo ti buton

User nga

<div klase = "btn-grupo" > 
  <a class = "btn btn-primary" href = "#" ><i klase = "ikono-a-usar nga ikono-puraw" ></i> User </a>   
  <a klase = "btn btn-pangruna a panagpababa-a-mabaliwan" data-toggle = "agpababa" href = "#" ><span klase = "caret" ></span></a>    
  <ul klase = "nababa-a-menu" > 
    <li><a href = "#" ><i klase = "ikono-lapis" </i> Urnosen </a></li>  
    <li><a href = "#" ><i klase = "ikono-basura" </i> Ikkaten </a></li>  
    <li><a href = "#" ><i klase = "sirkulo-ti-iparit-ti-ikono" ></i> Iparit </a></li>  
    <li klase = "mangbingay" </li> 
    <li><a href = "#" ><i klase = "siak" ></i> Agaramid ti admin </a></li>  
  </ul>
</div>

Dagiti kadakkel ti buton

Bituen Bituen Bituen

<a klase = "btn btn-dakkel" href = "#" ><i klase = "ikono-bituen" ></i> Bituen </a>   
<a klase = "btn btn-bassit" href = "#" ><i klase = "ikono-bituen" ></i> Bituen </a>   
<a klase = "btn btn-mini" href = "#" ><i klase = "ikono-bituen" ></i> Bituen </a>

Panaglayag

<ul klase = "nav nav-listaan" > 
  <li class = "aktibo" ><a href = "#" ><i klase = "ikono-pagtaengan nga ikono-puraw" </i> Pagtaengan </a></li>   
  <li><a href = "#" ><i klase = "libro-a-ikono" </i> Biblioteka </a></li>  
  <li><a href = "#" ><i klase = "ikono-lapis" ></i> Dagiti aplikasion </a></li>  
  <li><a href = "#" ><i klase = "siak" ></i> Nadumaduma </a></li>  
</ul>

Porma dagiti tay-ak

<div klase = "grupo-a-kontrol" > 
  <label class = "kontrol-etiketa" para iti = "inputIcon" > Adres ti email </label>  
  <div klase = "dagiti kontrol" > 
    <div klase = "panangserrek-a-prepend" > 
      <span class = "nainayon" ><i klase = "ikono-sobre" ></i></span>  
      < klase ti panagserrek = "span2" id = "Icon ti panagserrek" tipo = "teksto" >   
    </div>
  </div>
</div>

Tipograpia

Dagiti Paulo

h1. Paulo 1

h2. Paulo 2

h3. Paulo 3

h4. Paulo 4

h5. Paulo 5

h6. Paulo 6

Kopia ti bagi

Kopia ti bagi ti lead

Naibangon iti Basbassit

Pannakaitalmeg

<small>

Naingel

Dagiti Italiko

Dagiti klase ti panagtunos

Dagiti klase ti panangipaganetget

Dagiti abbreviation

<abbr>

<abbr class="initialism">

Dagiti Adres

<address>

Dagiti sitas ti bloke

Default nga blockquote

Blockquote dagiti pagpilian

Panagnagan iti maysa a gubuayan

Agsinnublat dagiti display

Dagiti Listaan

Di naurnos

Nabilin

Saan nga estilo

Inline nga

Panangiladawan

Paisaad nga deskripsion

Kodigo nga

Inline nga

Basic nga bloke

Dagiti Lamisaan

Dagiti default nga estilo

Opsional a klase

.table-striped

.table-bordered

.table-hover

.table-condensed

Opsional a klase ti hilera

Nasuportaran ti panagmarka ti lamisaan

Dagiti Pormas

Dagiti default nga estilo

Dagiti opsional a layout

Pormas ti panagsapul

Inline nga porma

Paisaad a porma

Nasuportaran dagiti kontrol ti porma

Dagiti Input

Lugar ti Teksto

Dagiti checkbox ken radio

Default (naurnong) .

Inline dagiti kahon ti tsek

Pilien ti

Panangpalawa kadagiti kontrol ti porma

Nasaksakbay ken naikapet nga inputs

Dagiti default a pagpilian

Nagtipon

Butones imbes a teksto

Dagiti dropdown ti buton

Nabingaybingay dagiti dropdown a grupo

Pormas ti panagsapul

Kontrolado ti panagdakkel

Dagiti input ti lebel ti bloke

Relatibo a panagdakkel

Panagdakkel ti grid

Dagiti di ma-edit nga input

Pormaen dagiti tignay

Teksto ti tulong

Tulong iti inline

I-block ti tulong

Porma dagiti estado ti panangkontrol

I-put ti pokus

Di umiso nga input

Dagiti baldado nga input

`<small>`

`<abbr>`

`<abbr class="initialism">`

`<address>`

`.table-striped`

`.table-bordered`

`.table-hover`

`.table-condensed`