Izihloko

<h1>Zonke izihloko ze - HTML, <h6>ziyafumaneka.

h1. Isihloko 1

h2. Isihloko 2

h3. Isihloko 3

h4. Isihloko 4

h5. Isihloko 5

h6. Isihloko 6

Ikopi yomzimba

Ukungagqibekanga kweBootstrap yehlabathi yifont-size 14px , ene line-height20px . Oku kusetyenziselwa kuyo yonke imihlathi. Ukongeza, (imihlathi) ifumana umda osezantsi wesiqingatha sobude bomgca wabo (10px ngokungagqibekanga).<body><p>

Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Kwenziwe ullamcorper nulla non metus auctor fringilla. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Kwenziwe ullamcorper nulla non metus auctor fringilla.

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

<p> ... </p>

Ikopi yomzimba okhokelayo

Yenza umhlathi ugqame ngokongeza .lead.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.

<p iklasi = "inkokeli" > ... </p>

Yakhiwe ngeNcinci

Isikali sokuchwetheza sisekelwe kwizinto ezimbini eziguquguqukayo EZINGAPHANTSI kwizinto eziguquguqukayo.Ngaphantsi : @baseFontSizekwaye @baseLineHeight. Eyokuqala sisiseko sobukhulu befonti esetyenziswa kuyo yonke indawo kwaye eyesibini bubude bomgca wesiseko. Sisebenzisa ezo ziguquguqukayo kunye nezibalo ezilula ukwenza imida, iipadi, kunye nokuphakama kwemigca yalo lonke uhlobo lwethu nokunye. Yenza ngokwezifiso kunye ne-Bootstrap iqhelanisa.

Ugxininiso

Sebenzisa iithegi ze-HTML zogxininiso olungagqibekanga ezinezimbo ezikhaphukhaphu.

`<small>`

Ukungagxininisi kumgca okanye iibhloko zombhalo, sebenzisa ithegi encinci.

Lo mgca wokubhaliweyo wenzelwe ukuphathwa njengoshicilelo olucolekileyo.

<p> <encinci> Lo mgca wokubhaliweyo wenzelwe ukuphathwa njengoshicilelo oluhle. </ encinci> </p>

Engqindilili

Ukugxininisa i-snippet yesicatshulwa esinobunzima befonti enzima.

Isiqwengana esilandelayo sokubhaliweyo sinikezelwa njengombhalo ongqindilili .

<strong> inikezelwe njengombhalo ongqindilili </strong>

akekeliswe sithi

Ukugxininisa isiqwengana sokubhaliweyo okukekeleyo.

Esi siqwengana silandelayo sokubhaliweyo sinikezelwa njengombhalo okekeleyo .

<em> inikezelwe njengombhalo okekeleyo </em>

Iintloko phezulu!Zive ukhululekile ukusebenzisa <b>nakwi <i>-HTML5. <b>yenzelwe ukuqaqambisa amagama okanye amabinzana ngaphandle kokudlulisela ukubaluleka okongeziweyo ngelixa <i>ubukhulu becala iselizwi, amagama obugcisa, njl.

Iiklasi zokulungelelanisa

Ukulungelelanisa isicatshulwa ngokulula kumacandelo aneeklasi zolungelelwaniso lokubhaliweyo.

Umbhalo olungelelaniswe ekhohlo.

Isiqendu esilungelelaniswe embindini.

Isiqendu esilungelelaniswe ekunene.

<p class = "text-left" > Umbhalo olungelelaniswe ekhohlo. </p> 
<p class = "text-center" > Isicatshulwa esilungelelaniswe embindini. </p> 
<p class = "text-right" > umbhalo olungelelaniswe ekunene. </p>

Iiklasi zokugxininisa

Ukuhambisa intsingiselo ngombala ngeqela leeklasi eziluncedo zogxininiso.

Fusce dapibus, tellus ac cursus commodo, tor mauris nibh.

Etiam porta sem malesuada magna mollis euismod.

Kwenziwe ullamcorper nulla non metus auctor fringilla.

Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula.

<p iklasi = "ithulisiwe" > Fusce dapibus, tellus ac cursus commodo, tor mauris nibh. </p> 
<p class = "text-warning" > Etiam porta sem malesuada magna mollis euismod. </p> 
<p iklasi = "impazamo yombhalo" > Donec ullamcorper nulla non metus auctor fringilla. </p> 
<p class = "text-info" > Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis. </p> 
<p class = "text-success" > Duis mollis, est non commodo luctus, nisi erat porttitor ligula. </p>

Ushunqulelo

Uzalisekiso olucwangcisiweyo lwesiqalelo se-HTML <abbr>kwizifinyezo kunye nee-akhronimi ukubonisa uguqulelo olwandisiweyo kwi-hover. Ushunqulelo olunophawu titleloyelelwano lunomda osezantsi onamachaphaza akhanyayo kunye nekhesa yoncedo kwi-hover, ebonelela ngomongo owongezelelweyo kwi-hover.

`<abbr>`

Kumbhalo owandisiweyo kwihove ende yesifinyezo, quka titleuphawu loyelelwano.

Isishunqulelo segama loyelelwano sithi attr .

<abbr isihloko = "uphawu" > attr </abbr>

`<abbr class="initialism">`

Yongeza .initialismkwisifinyezo sefonti encinci kancinane.

I- HTML yeyona nto ilungileyo ukusukela kwisonka esisikiweyo.

<abbr title = "ULwimi lokuLawulwa kwe-HyperText" iklasi = "i-initialism" > HTML </abbr>

Iidilesi

Bonisa iinkcukacha zoqhagamshelwano zoyena khokho ukufutshane okanye wonke umsebenzi.

`<address>`

Gcina ukufomatha ngokuphelisa yonke imigca nge <br>.

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

Igama elipheleleyo
[email protected]

<idilesi>
  <strong> Twitter, Inc. </strong><br>
  795 Folsom Ave, Suite 600 <br>
  San Francisco, CA 94107 <br>
  <abbr isihloko = "Ifowuni" > P: </abbr> (123) 456-7890 
</ idilesi>
 
<idilesi>
  <strong> Igama elipheleleyo </strong><br>
  <a href = "imeyileto:#" > [email protected] </a> 
</ idilesi>

Iingcaphuno zebhloko

Ukucaphula iibhloko zomxholo komnye umthombo ngaphakathi koxwebhu lwakho.

I-blockquote ehlala ikho

Gquba <blockquote>malunga nayo nayiphi na i- HTML njengesicatshulwa. Kwiingcaphuno ezithe ngqo sicebisa ukuba a <p>.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. I-integer posuere erat ante.

<blockquote>
  <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. I-integer posuere erat ante. </p>
</blockquote>

Iinketho zeBlockquote

Isitayela kunye noshintsho lomxholo kwiinguqu ezilula kwi-blockquote eqhelekileyo.

Ukuchaza umthombo

Yongeza <small>ithegi yokuchonga umthombo. Gquba igama lomthombo womsebenzi kwi <cite>.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. I-integer posuere erat ante.
Umntu odumileyo kwiSihloko soMthombo

<blockquote>
  <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. I-integer posuere erat ante. </p>
  <encinci> Umntu odumileyo <cite isihloko = "Isihloko somthombo" > Isihloko soMthombo </cite></small> 
</blockquote>

Enye imiboniso

Sebenzisa .pull-rightibhloko edadayo, elungelelaniswe ekunene.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. I-integer posuere erat ante.
Umntu odumileyo kwiSihloko soMthombo

<blockquote class = "tsala-ekunene" > 
  ...
</blockquote>

Uluhlu

Ayiodolwanga

Uluhlu lwezinto apho umyalelo awubalulekanga ngokucacileyo .

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem kunye ne-massa
I-Facilisis kwi-pretium nisl aliquet
Nulla volutpat aliquam velit
- Phasellus iaculis neque
- I-Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
I-Faucibus porta lacus fringilla vel
Aenean sit amet erat nunc
Eget porttitor lorem

<ul>
  <li> ... </ li>
</ul>

Iodolwe

Uluhlu lwezinto apho ulandelelwano lubaluleke kakhulu.

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem kunye ne-massa
I-Facilisis kwi-pretium nisl aliquet
Nulla volutpat aliquam velit
I-Faucibus porta lacus fringilla vel
Aenean sit amet erat nunc
Eget porttitor lorem

<ol>
  <li> ... </ li>
</ ol>

Ayifakwanga isimbo

Susa i- list-stylepadding engagqibekanga kunye nesekhohlo kwizinto zoluhlu (abantwana abasondeleyo kuphela).

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem kunye ne-massa
I-Facilisis kwi-pretium nisl aliquet
Nulla volutpat aliquam velit
- Phasellus iaculis neque
- I-Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
I-Faucibus porta lacus fringilla vel
Aenean sit amet erat nunc
Eget porttitor lorem

<ul class = "unstyled" > 
  <li> ... </ li>
</ul>

Nomgca

Beka zonke izinto zoluhlu kumgca omnye kunye inline-blockne-padding ekhanyayo.

Lorem ipsum
Phasellus iaculis
Nulla volutpat

<ul iklasi = "inline" > 
  <li> ... </ li>
</ul>

Inkcazo

Uluhlu lwamagama aneenkcazo ezinxulumene nawo.

Uluhlu lweenkcazelo: Uluhlu lwenkcazo lufanelekile ukuchaza amagama.
Euismod: Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.; Donec id elit non mi porta gravida at eget metus.
Malesuada porta: Etiam porta sem malesuada magna mollis euismod.

<dl>
  <dt> ... </ dt>
  <dd> ... </ dd>
</dl>

Inkcazo ethe tye

Yenza imigaqo kunye neenkcazo <dl>ngokulandelelana kwicala elinye.

Uluhlu lweenkcazelo: Uluhlu lwenkcazo lufanelekile ukuchaza amagama.
Euismod: Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.; Donec id elit non mi porta gravida at eget metus.
Malesuada porta: Etiam porta sem malesuada magna mollis euismod.
Felis euismod semper eget lacinia: Fusce dapibus, tellus ac cursus commodo, tor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

<dl iklasi = "dl-horizontal" > 
  <dt> ... </ dt>
  <dd> ... </ dd>
</dl>

Iintloko phezulu!Uluhlu lwenkcazo ethe tye luya kucutha amagama amade kakhulu ukuba angangena kuluhlu lwasekhohlo text-overflow. Kwiindawo zokujonga ezimxinwa, ziya kutshintshela kuyilo olupakishweyo olungagqibekanga.

Nomgca

Songa iziqwengana zekhowudi nge <code>.

Umzekelo, <section>kufuneka isongwe njengomgca.

Umzekelo , < ikhowudi> & lt ; icandelo & gt ;</ ikhowudi > kufuneka isongelwe njenge -inline .

Ibhloko esisiseko

Sebenzisa <pre>kwimigca emininzi yekhowudi. Qiniseka ukuba ubaleka naziphi na izibiyeli ze-engile kwikhowudi yonikezelo olufanelekileyo.

<p>Isampuli yombhalo apha...</p>

<pre>
  <p>Umzekelo wokubhaliweyo apha...</p>
</pre>

Iintloko phezulu!Qinisekisa ukugcina ikhowudi ngaphakathi <pre>kweethegi ngokusondeleyo ekhohlo kangangoko; iyakwenza zonke iithebhu.

Unokukhetha ukongeza .pre-scrollableiklasi eya kuseka ubude bobude obuyi-350px kwaye ibonelele nge-y-axis scrollbar.

Izimbo ezihlala zikhona

Kwi-styling esisiseko-i-padding ekhanyayo kunye ne-horizontal dividers kuphela-yongeza iklasi yesiseko .tablekuyo nayiphi na <table>.

#	Igama lokuqala	Ifani	Igama lomsebenzisi
1	Phawula	Otto	@mdo
2	uYakobi	Thornton	@fat
3	Larry	intaka	@twitter

< iklasi yetafile = "itafile" > 
  …
</ table>

Iiklasi ozikhethelayo

Yongeza nayiphi na kwezi klasi zilandelayo kwiklasi .tableyesiseko.

`.table-striped`

Yongeza i-zebra-striping nakuwuphi na umqolo wetafile ngaphakathi kwe <tbody>CSS :nth-childumkhethi (awufumaneki kwi-IE7-8).

#	Igama lokuqala	Ifani	Igama lomsebenzisi
1	Phawula	Otto	@mdo
2	uYakobi	Thornton	@fat
3	Larry	intaka	@twitter

< iklasi yetafile = "itafile-imigca yetafile" > 
  …
</ table>

`.table-bordered`

Yongeza imida kunye neekona ezijikelezileyo kwitafile.

#	Igama lokuqala	Ifani	Igama lomsebenzisi
1	Phawula	Otto	@mdo
1	Phawula	Otto	@getbootstrap
2	uYakobi	Thornton	@fat
3	Larry intaka		@twitter

< iklasi yetafile = "itafile yetafile-umda" > 
  …
</ table>

`.table-hover`

Yenza imo yokushukuma kwimiqolo yetafile ngaphakathi kwe <tbody>.

#	Igama lokuqala	Ifani	Igama lomsebenzisi
1	Phawula	Otto	@mdo
2	uYakobi	Thornton	@fat
3	Larry intaka		@twitter

< iklasi yetafile = "itafile yetafile-hover" > 
  …
</ table>

`.table-condensed`

Yenza iitafile zihlangane ngakumbi ngokusika i-cell padding kwisiqingatha.

#	Igama lokuqala	Ifani	Igama lomsebenzisi
1	Phawula	Otto	@mdo
2	uYakobi	Thornton	@fat
3	Larry intaka		@twitter

< iklasi yetafile = "itafile yetafile-icondensed" > 
  …
</ table>

Iiklasi zomqolo ozikhethelayo

Sebenzisa iiklasi zomxholo ukufaka imibala kwimigca yetafile.

Iklasi	Inkcazo
`.success`	Ibonisa isenzo esiyimpumelelo okanye esilungileyo.
`.error`	Ibonisa isenzo esinobungozi okanye esinokuthi sibe sibi.
`.warning`	Ibonisa isilumkiso esinokufuna ukuhoywa.
`.info`	Isetyenziswa njengenye indlela kwizimbo ezingagqibekanga.

#	Imveliso	Intlawulo ethathiweyo	Ubume
1	I-TB - Ngenyanga	01/04/2012	Ivunyiwe
2	I-TB - Ngenyanga	02/04/2012	Yaliwe
3	I-TB - Ngenyanga	03/04/2012	Ilindile
4	I-TB - Ngenyanga	04/04/2012	Fowuna ukuze uqinisekise

...
  < tr class = "impumelelo" >
    <td> 1 < /td>
    <td>TB - Ngenyanga</ td >
    <td> 01 / 04 / 2012 < /td>
    <td>Ivunyiwe</ td >
  </ tr >
...

Uphawulo lwetafile oluxhaswayo

Uluhlu lwezinto ezixhaswayo zetafile yeHTML kunye nendlela ekufuneka zisetyenziswe ngayo.

Ithegi	Inkcazo
`<table>`	Isiqalelo sokusonga sokubonisa idatha kwifomathi yetheyibhuli
`<thead>`	Isiqulatho sesiqalelo semigca yeheader yetheyibhile ( `<tr>`) ukuleyibhelisha kwimiqolo yetafile
`<tbody>`	Isiqulatho sesiqalelo semiqolo yetafile ( `<tr>`) kumzimba wetheyibhile
`<tr>`	Isiqulatho sesiqalelo seseti yeeseli zetafile ( `<td>`okanye `<th>`) evela kumqolo omnye
`<td>`	Iseli yetafile ehlala ikho
`<th>`	Iseli yetafile ekhethekileyo yekholamu (okanye umqolo, ngokuxhomekeke kububanzi kunye nokubekwa) iilebhile
`<caption>`	Inkcazo okanye isishwankathelo sezinto ezigcinwe yitheyibhile, ngakumbi ziluncedo kubafundi besikrini

<itheyibhile>
  <caption> ... </caption>
  <intloko>
    <tr>
      <th> ... </th>
      <th> ... </th>
    </tr>
  </ intloko>
  <iqela>
    <tr>
      <td> ... </td>
      <td> ... </td>
    </tr>
  </ umzimba>
</ table>

Izimbo ezihlala zikhona

Ulawulo lwefomu yomntu ngamnye lufumana isimbo, kodwa ngaphandle koluhlu olusisiseko olufunekayo <form>okanye utshintsho olukhulu kuphawulo. Iziphumo zipakishwe, iilebhile ezilungelelaniswe ekhohlo phezu kolawulo lweefom.

<ifomu>
  <iseti yendawo>
    <legend> Ilivo </legend>
    <ileyibhile> Igama leleyibhile </ ileyibheli>
    <input type = "text" isibambi- ndawo = "Chwetheza into..." >  
    <span class = "help-block" > Umzekelo wokubhaliweyo koncedo lwebhloko apha. </ span> 
    < iklasi yeleyibhile = "ibhokisi yokukhangela" > 
      <input type = "checkbox" > Ndijonge 
    </ ileyibhile>
    < uhlobo lweqhosha = "submit " class = "btn" > Ngenisa </ iqhosha>  
  </ iseti yendawo>
</ ifom>

Uyilo olukhethwayo

Ibandakanywe neBootstrap zintathu iifom ozikhethelayo zoyilo kwiimeko zokusetyenziswa okuqhelekileyo.

Khangela ifomu

Yongeza .form-searchkwifom nakwi .search-query- <input>ukwenzela igalelo lombhalo olongezelelweyo.

< iklasi yefom = "ifomu-ukukhangela" > 
  <input type = "text" class = "input-medium search-query" >  
  < uhlobo lweqhosha = "submit " class = "btn" > Khangela </ iqhosha>  
</ ifom>

Ifom engaphakathi

Yongeza .form-inlineiilebhile ezilungelelaniswe ekhohlo kunye nolawulo lwebhloko engaphakathi kuyilo oludityanisiweyo.

<ifom yeklasi = "ifom-inline" > 
  <input type = "text" class = "input-small" placeholder = "I-imeyile" >   
  <input type = "password" class = "input-small" placeholder = "Password" >   
  < iklasi yeleyibhile = "ibhokisi yokukhangela" > 
    <input type = "checkbox" > Ndikhumbule 
  </ ileyibhile>
  < uhlobo lweqhosha = "submit " class = "btn" > Sayina </ iqhosha>  
</ ifom>

Ifom ethe tye

Lungelelanisa ekunene iilebhile kwaye uzidadalise ekhohlo ukuze uzenze zivele kumgca omnye njengolawulo. Ifuna olona tshintsho lophawulo lusuka kwifomu emiyo:

Yongeza .form-horizontalkwifom
Songa iilebhile kunye nolawulo.control-group
Yongeza .control-labelkwileyibhile
Qhoboshela kulo naluphi na ulawulo olunxulumeneyo .controlsukulungiselela ulungelelwaniso olululo

< iklasi yefom = "ifom-horizontal" > 
  <div class = "control-group" > 
    <label class = "control-label" for = "inputEmail" > I- imeyile </label>  
    <div class = "controls" > 
      <input type = "text" id = "inputEmail" isibambi- ndawo = "I-imeyile" >   
    </ div>
  </ div>
  <div class = "control-group" > 
    < iklasi yeleyibhile = "control-label" for = "inputPassword" > Igama lokugqitha </label>  
    <div class = "controls" > 
      <input type = "password" id = "inputPassword" placeholder = " Password" >   
    </ div>
  </ div>
  <div class = "control-group" > 
    <div class = "controls" > 
      < iklasi yeleyibhile = "ibhokisi yokukhangela" > 
        <input type = "checkbox" > Ndikhumbule 
      </ ileyibhile>
      < uhlobo lweqhosha = "submit " class = "btn" > Sayina </ iqhosha>  
    </ div>
  </ div>
</ ifom>

Ulawulo lweefomu ezixhaswayo

Imizekelo yolawulo lweefom eziqhelekileyo ezixhaswa kuyilo lwefom yomzekelo.

Igalelo

Uninzi lwefomu yolawulo oluxhaphakileyo, imimandla yokufaka esekwe ngokubhaliweyo. Ibandakanya inkxaso yazo zonke iintlobo ze-HTML5: umbhalo, igama lokugqitha, ixesha, ixesha lendawo, umhla, inyanga, ixesha, iveki, inombolo, i-imeyile, url, ukukhangela, umnxeba, kunye nombala.

Ifuna ukusetyenziswa okuxeliweyo typengamaxesha onke.

<input type = "text" placeholder = "Igalelo lombhalo" >

Textarea

Ulawulo lwefom oluxhasa imigca emininzi yokubhaliweyo. Guqula rowsuphawu xa kuyimfuneko.

<textarea rows = "3" ></textarea>

Iibhokisi zokutshekisha kunye noonomathotholo

Iibhokisi zokujonga zezokukhetha enye okanye iinketho ezininzi kuluhlu ngelixa oonomathotholo bezokukhetha ukhetho olunye kwabaninzi.

Okuhlala kukho (kupakishwe)

< iklasi yeleyibhile = "ibhokisi yokukhangela" > 
  <input type = "checkbox" value = "" >  
  Ukhetho lokuqala yile kwaye leya-qiniseka ukuba ubandakanya ukuba kutheni ilungile
</ ileyibhile>
 
< iklasi yelebhile = "irediyo" > 
  <input type = "radio" name = "optionsRadios" id = "optionsRadios1" value = "option1" ikhangelwe >     
  Ukhetho lokuqala yile kwaye leya-qiniseka ukuba ubandakanya ukuba kutheni ilungile
</ ileyibhile>
< iklasi yelebhile = "irediyo" > 
  <input type = "radio" name = "optionsRadios" id = "optionsRadios2" value = "option2" >    
  Ukhetho lwesibini lunokuba yenye into kwaye ukuyikhetha kuya kuyeka ukukhetha enye
</ ileyibhile>

Iibhokisi zokujonga ngaphakathi

Yongeza .inlineiklasi kuluhlu lweebhokisi zokukhangela okanye iirediyo zolawulo zivela kumgca omnye.

< iklasi yeleyibhile = "ibhokisi yokukhangela emgceni" > 
  <input type = "checkbox" id = "inlineCheckbox1" value = "option1" > 1   
</ ileyibhile>
< iklasi yeleyibhile = "ibhokisi yokukhangela emgceni" > 
  <input type = "checkbox" id = "inlineCheckbox2" value = "option2" > 2   
</ ileyibhile>
< iklasi yeleyibhile = "ibhokisi yokukhangela emgceni" > 
  <input type = "checkbox" id = "inlineCheckbox3" value = "option3" > 3   
</ ileyibhile>

Ikhetha

Sebenzisa inketho emiselweyo okanye uchaze u- multiple="multiple"a ukubonisa iinketho ezininzi ngaxeshanye.

<khetha>
  <ukhetho> 1 </ ukhetho>
  <ukhetho> 2 </option>
  <ukhetho> 3 </ ukhetho>
  <ukhetho> 4 </ ukhetho>
  <ukhetho> 5 </ ukhetho>
</ khetha>
 
<khetha ezininzi = "ezininzi" > 
  <ukhetho> 1 </ ukhetho>
  <ukhetho> 2 </option>
  <ukhetho> 3 </ ukhetho>
  <ukhetho> 4 </ ukhetho>
  <ukhetho> 5 </ ukhetho>
</ khetha>

Ukwandiswa kolawulo lweefom

Ukongeza phezulu kulawulo lwebrawuza esele ikhona, iBootstrap ibandakanya ezinye iinxalenye zefom eluncedo.

Amagalelo angaphambili nafakelweyo

Yongeza umbhalo okanye amaqhosha ngaphambi okanye emva kwalo naliphi na igalelo elisekwe kwiteksti. Qaphela ukuba selectizinto azixhaswanga apha.

Ukhetho oluhlala lukhona

Songa i- .add-oni inputkunye nenye yeeklasi ezimbini ukulungiselela okanye ukongeza isicatshulwa kwigalelo.

<div class = "input-prepend" > 
  <span class = "yongeza-on" > @ </span> 
  <input class = "span2" id = "prependedInput" type = "text" isibambi- ndawo = "Igama lomsebenzisi" >    
</ div>
<div class = "input-append" > 
  <input class = "span2" id = "appendedInput" type = "text" >   
  <span class = "add-on" > .00 </span> 
</ div>

Idityanisiwe

Sebenzisa zombini iiklasi kunye nemizekelo emibini .add-onyokulungiselela kunye nokongeza igalelo.

<div class = "input-prepend input-append" > 
  <span class = "i-add-on" > $ </span> 
  < iklasi yegalelo = "span2" id = "appendedPrependedInput" type = "text" >   
  <span class = "add-on" > .00 </span> 
</ div>

Amaqhosha endaweni yombhalo

Endaweni ye-a <span>enesicatshulwa, sebenzisa u- .btna ukuncamathelisa iqhosha (okanye amabini) kwigalelo.

<div class = "input-append" > 
  < iklasi yegalelo = "span2" id = "appendedInputButton" type = "text" >   
  < iklasi yeqhosha = "btn" type = "iqhosha" > Yiya! </ iqhosha>  
</ div>

<div class = "input-append" > 
  < iklasi yegalelo = "span2" id = "appendedInputButtons" type = "text" >   
  < iklasi yeqhosha = "btn" type = "iqhosha" > Khangela </ iqhosha>  
  < iklasi yeqhosha = "btn" uhlobo = "iqhosha" > Iinketho </ iqhosha>  
</ div>

Amaqhosha okwehla

<div class = "input-append" > 
  < iklasi yegalelo = "span2" id = "appendedDropdownButton" type = "text" >   
  <div iklasi = "iqela le-btn" > 
    < iklasi yeqhosha = "btn dropdown-toggle" data-toggle = "dropdown" >  
      Isenzo
      <span class = "caret" > </ span> 
    </ iqhosha>
    <ul class = "dropdown-menu" > 
      ...
    </ul>
  </ div>
</ div>

<div class = "input-prepend" > 
  <div iklasi = "iqela le-btn" > 
    < iklasi yeqhosha = "btn dropdown-toggle" data-toggle = "dropdown" >  
      Isenzo
      <span class = "caret" > </ span> 
    </ iqhosha>
    <ul class = "dropdown-menu" > 
      ...
    </ul>
  </ div>
  < iklasi yegalelo = "span2" id = "prependedDropdownButton" type = "text" >   
</ div>

<div class = "input-prepend input-append" > 
  <div iklasi = "iqela le-btn" > 
    < iklasi yeqhosha = "btn dropdown-toggle" data-toggle = "dropdown" >  
      Isenzo
      <span class = "caret" > </ span> 
    </ iqhosha>
    <ul class = "dropdown-menu" > 
      ...
    </ul>
  </ div>
  < iklasi yegalelo = "span2" id = "appendedPrependedDropdownButton" type = "text" >   
  <div iklasi = "iqela le-btn" > 
    < iklasi yeqhosha = "btn dropdown-toggle" data-toggle = "dropdown" >  
      Isenzo
      <span class = "caret" > </ span> 
    </ iqhosha>
    <ul class = "dropdown-menu" > 
      ...
    </ul>
  </ div>
</ div>

Amaqela okwehla acandiweyo

<ifomu>
  <div class = "input-prepend" > 
    <div class = "btn-iqela" > ... </div> 
    <input type = "text" > 
  </ div>
  <div class = "input-append" > 
    <input type = "text" > 
    <div class = "btn-iqela" > ... </div> 
  </ div>
</ ifom>

Khangela ifomu

< iklasi yefom = "ifomu-ukukhangela" > 
  <div class = "input-append" > 
    <input type = "text" class = "span2 search-query" >  
    < uhlobo lweqhosha = "ngenisa" iklasi  = "btn" > Khangela </ iqhosha>
  </ div>
  <div iklasi = "input-prepend" >
    < uhlobo lweqhosha = "ngenisa" iklasi = "btn"  > Khangela </ iqhosha>
    <input type = "text" iklasi  = "span2 search-query" >
  </ div>
</ ifom>

Lawula ubungakanani

Sebenzisa iiklasi zokulinganisa ubungakanani obufana .input-largeokanye utshatise amagalelo akho kwigridi yobukhulu bekholamu usebenzisa .span*iiklasi.

Block amagalelo kwinqanaba

Yenza nayiphi na <input>okanye <textarea>into iziphathe njengomgangatho webhloko.

< iklasi yegalelo = "input-block-level" type = "text" placeholder = ".input-block-level" >

Ubungakanani obuhambelanayo

< iklasi yegalelo = "input-mini" type = "text" isibambi- ndawo = ".input-mini" >   
< iklasi yegalelo = "input-small" type = "text" placeholder = ".input-small" >   
< iklasi yegalelo = "input-medium" type = "text" isibambi- ndawo = ".input-medium" >   
< iklasi yegalelo = "input-large" type = "text" placeholder = ".input-large" >   
< iklasi yegalelo = "input-xlarge" type = "text" placeholder = ".input-xlarge" >   
< iklasi yegalelo = "input-xxlarge" type = "text" placeholder = ".input-xxlarge" >

Iintloko phezulu!Kwiinguqulelo ezizayo, siza kube sitshintsha ukusetyenziswa kwezi klasi zongeniso zihambelana nobukhulu bethu bamaqhosha. Umzekelo, .input-largeiyakwandisa i-padding kunye nobukhulu befonti yegalelo.

Ubungakanani begridi

Sebenzisa .span1ukuya .span12kumagalelo ahambelana nobukhulu obufanayo bekholamu zegridi.

< iklasi yegalelo = "span1" type = "text" placeholder = ".span1" >   
< iklasi yegalelo = "span2" type = "text" placeholder = ".span2" >   
< iklasi yegalelo = "span3" type = "text" placeholder = ".span3" >   
<khetha iklasi = "span1" > 
  ...
</ khetha>
<khetha iklasi = "span2" > 
  ...
</ khetha>
<khetha iklasi = "span3" > 
  ...
</ khetha>

Kumagalelo egridi ngomgca ngamnye, sebenzisa udidi .controls-rowlwesilungisi kwisithuba esifanelekileyo . Idada amagalelo ukudiliza isithuba esimhlophe, ibeka imida eyiyo, kwaye icoca into edadayo.

<div class = "controls" > 
  < iklasi yegalelo = "span5" type = "text" placeholder = ".span5" >   
</ div>
<div class = "uluhlu lolawulo lolawulo" > 
  <input class = "span4" type = "text" placeholder = ".span4" >   
  < iklasi yegalelo = "span1" type = "text" placeholder = ".span1" >   
</ div>
...

Amagalelo angenakuhleleleka

Nikeza idatha kwifomu engenakuhleleka ngaphandle kokusebenzisa uphawu lokwenene.

<span class = "input-xlarge-input-input" > Ixabiso elithile apha </span>

Iintshukumo zefom

Phelisa ifom ngeqela lezenzo (amaqhosha). Xa ibekwe ngaphakathi kwe .form-actions, amaqhosha aya kuzibophelela ngokuzenzekela ukuhambelana nolawulo lwefom.

<div class = "ifomu-izenzo" > 
  < uhlobo lweqhosha = "submit " class = "btn btn-primary" > Gcina utshintsho </ iqhosha>  
  < uhlobo lweqhosha = "iqhosha" iklasi = "btn" > Rhoxisa </ iqhosha>  
</ div>

Umbhalo woncedo

Inkxaso yenqanaba le-inline kunye nebhloko yesicatshulwa soncedo esivela malunga nolawulo lwefom.

Uncedo lwangaphakathi

<input type = "text" ><span class = "help-inline" > umbhalo woncedo lwangaphakathi </span>

Vimba uncedo

<input type = "text" ><span class = "help-block" > Ibhloko ende yesicatshulwa soncedo esiqhekeza kumgca omtsha kwaye sinokudlulela ngaphaya komgca omnye. </ span>

Iimeko zolawulo lwefom

Nika ingxelo kubasebenzisi okanye abatyeleli ngeengxelo ezisisiseko malunga nolawulo lweefomu kunye neelebhile.

Ugqaliselo lwegalelo

Sisusa izimbo ezingagqibekanga outlinekulawulo oluthile kwaye sisebenzise u a box-shadowendaweni yalo :focus.

<input class = "input-xlarge" id = "focusedInput" type = "text" value = "Oku kugxilwe..." >

Ungeniso olungasebenziyo

Ungeniso lwesimbo ngokusebenza komkhangeli zincwadi ongagqibekanga nge :invalid. Cacisa i type, yongeza requireduphawu ukuba intsimi ayikhethi, kwaye (ukuba ikhona) khankanya apattern .

Oku akufumaneki kwiinguqulelo ze-Internet Explorer 7-9 ngenxa yokunqongophala kwenkxaso yabakhethi be-CSS bobuxoki.

<input class = "span3" type = "imeyile" efunekayo >

Amagalelo avaliwe

Yongeza disableduphawu kwigalelo ukukhusela igalelo lomsebenzisi kwaye uqalise inkangeleko eyahlukileyo kancinane.

<input class = "input-xlarge" id = "disabledInput" type = "text" isibambi- ndawo = "Igalelo elingasebenziyo apha..." luvaliwe >

Iimeko zokuqinisekisa

I-Bootstrap ibandakanya izimbo zokuqinisekisa impazamo, isilumkiso, ulwazi, kunye nemiyalezo yempumelelo. Ukusebenzisa, yongeza iklasi efanelekileyo kwindawo engqongileyo .control-group.

<div class = "isilumkiso-iqela lolawulo" > 
  <label class = "control-label" for = "inputWarning" > Igalelo elinesilumkiso </ label>  
  <div class = "controls" > 
    <input type = "text" id = "inputWarning" >  
    <span class = "help-inline" > Kukho into enokuba ayihambanga kakuhle </span> 
  </ div>
</ div>
 
<div class = "impazamo yeqela lokulawula" > 
  < iklasi yeleyibhile = "control-label" for = "inputError" > Igalelo ngempazamo </label>  
  <div class = "controls" > 
    <input type = "text" id = "inputError" >  
    <span class = "help-inline" > Nceda ulungise impazamo </span> 
  </ div>
</ div>
 
<div class = "ulwazi lweqela lokulawula" > 
  < iklasi yeleyibhile = "control-label" for = "inputInfo" > Igalelo ngolwazi </label>  
  <div class = "controls" > 
    <input type = "text" id = "inputInfo" >  
    <span class = "help-inline" > Igama lomsebenzisi sele lithathiwe </span> 
  </ div>
</ div>
 
<div class = "ulawulo-impumelelo yeqela" > 
  <label class = "control-label" for = "inputSuccess" > Igalelo elinempumelelo </label>  
  <div class = "controls" > 
    <input type = "text" id = "inputSuccess" >  
    <span class = "help-inline" > Woohoo! </ span> 
  </ div>
</ div>

Amaqhosha amiselweyo

Izimbo zamaqhosha zinokusetyenziswa kuyo nantoni na .btneneklasi esetyenzisiweyo. Nangona kunjalo, ngokwesiqhelo uya kufuna ukusebenzisa ezi kuphela <a>kunye <button>nezinto zonikezelo olungcono.

Iqhosha	iklasi=""	Inkcazo
	`btn`	Iqhosha eligreyi eliqhelekileyo elinothatho
	`btn btn-primary`	Ibonelela ngobunzima obubonakalayo obongezelelweyo kwaye ichonge isenzo sokuqala kwiseti yamaqhosha
	`btn btn-info`	Isetyenziswa njengenye indlela kwizimbo ezingagqibekanga
	`btn btn-success`	Ibonisa isenzo esiyimpumelelo okanye esilungileyo
	`btn btn-warning`	Ibonisa ukuba kufuneka kuthatyathwe isilumkiso ngeli nyathelo
	`btn btn-danger`	Ibonisa isenzo esinobungozi okanye esinokuthi sibe sibi
	`btn btn-inverse`	Elinye iqhosha elimnyama elingwevu, alibotshelelwanga kwisenzo semantic okanye ukusetyenziswa
	`btn btn-link`	Gxininisa iqhosha ngokulenza libukeke njengekhonkco ngelixa ugcina ukuziphatha kweqhosha

Ukuhambelana kwebrowser

I-IE9 ayikhuli imilinganiselo yangasemva kwiikona ezingqukuva, ngoko ke siyayisusa. Eyeleleneyo, i-IE9 yenza buttonizinto ezingasebenziyo, inikezela ngokungwevu okubhaliweyo ngesithunzi-sombhalo esibi esingenako ukusilungisa.

Ubungakanani beqhosha

Unqwenela amaqhosha amakhulu okanye amancinci? Yongeza .btn-large, .btn-small, okanye .btn-miniiisayizi ezongezelelweyo.

<p>
  <iqhosha leklasi = "btn btn-large btn-primary" type = "iqhosha" > Iqhosha elikhulu </ iqhosha>  
  < iklasi yeqhosha = "btn btn-large" type = "iqhosha" > Iqhosha elikhulu </ iqhosha>  
</p>
<p>
  < iklasi yeqhosha = "btn btn-primary" type = "iqhosha" > Iqhosha lokuhlala </ iqhosha>  
  < iklasi yeqhosha = "btn" type = "iqhosha" > Iqhosha elimiselweyo </ iqhosha>  
</p>
<p>
  <iqhosha leklasi = "btn btn-small btn-primary" type = "iqhosha" > Iqhosha elincinci </ iqhosha>  
  <iqhosha leklasi = "btn btn-small" type = "iqhosha" > Iqhosha elincinci </ iqhosha>  
</p>
<p>
  <iqhosha leklasi = "btn btn-mini btn-primary" type = "iqhosha" > Iqhosha elincinane </ iqhosha>  
  < iklasi yeqhosha = "btn btn-mini" type = "iqhosha" > Iqhosha elincinane </iqhosha>  
</p>

Yenza amaqhosha enqanaba lebhloko—lawo anwenwela kububanzi obupheleleyo bomzali— ngokongeza .btn-block.

<iqhosha leklasi = "btn btn-large btn-block btn-primary" type = "iqhosha" > Iqhosha lenqanaba lokubhloka </ iqhosha>  
< iklasi yeqhosha = "btn btn-large btn-block" type = "iqhosha" > iqhosha lenqanaba lokuvala </ iqhosha>

Ilizwe labakhubazekileyo

Yenza amaqhosha abonakale engenakucofa ngokuwacima umva 50%.

Into ye-ankile

Yongeza .disablediklasi <a>kumaqhosha.

Ikhonkco eliphambili Ikhonkco

<a href = "#" class = "btn btn-large btn-primary disabled"> Ikhonkco eliphambili </a>  
<a href = "#" class = "btn btn-large disabled"> Ikhonkco </a>

Iintloko phezulu!Sisebenzisa .disabledudidi oluluncedo apha, ngokufanayo .activenodidi oluqhelekileyo, ngoko ke akukho simaphambili sifunekayo. Kwakhona, le klasi yeyobuhle kuphela; kufuneka usebenzise iJavaScript yesiko ukuvala amakhonkco apha.

Into yeqhosha

Yongeza disableduphawu <button>kumaqhosha.

< uhlobo lweqhosha = "iqhosha" class = "btn btn-large btn-primary disabled" disabled = "disabled" > Iqhosha lokuqala </iqhosha>   
< uhlobo lweqhosha = "iqhosha" class = "btn btn-large" livaliwe > Iqhosha </ iqhosha>

Iklasi enye, iithegi ezininzi

Sebenzisa .btniklasi kwi- <a>, <button>, okanye <input>isiqalelo.

<a iklasi = "btn" href = ""> Ikhonkco </a> _  
< iklasi yeqhosha = "btn" type = "submit" > Iqhosha </ iqhosha>  
< iklasi yegalelo = "btn" type = "iqhosha" ixabiso = "Igalelo" >   
<input class = "btn" type = "submit" value = "Ngenisa" >

Njengolona qheliselo lungcono, zama ukuthelekisa inqaku lomxholo wakho ukuze uqinisekise ukuthelekisa unikezelo lwebrowser. Ukuba unayo input, sebenzisa <input type="submit">iqhosha lakho.

Yongeza iiklasi <img>kwinto ukwenza ngokulula isitayile imifanekiso kuyo nayiphi na iprojekthi.

<img src = "..." iklasi = "i-img-rounded" >  
<img src = "..." iklasi = "img-circle" >  
<img src = "..." iklasi = "img-polaroid" >

Iintloko phezulu! .img-roundedkwaye .img-circleungasebenzi kwi-IE7-8 ngenxa yokungabikho border-radiuskwenkxaso.

Ii icon zeglyphs

Ii-icon ze-140 kwifom ye-sprite, ekhoyo kwi-grey emnyama (engagqibekanga) kunye nemhlophe, enikezwe yi- Glyphicons .

icon-glass
icon-umculo
icon-ukukhangela
icon-mvulophu
icon-intliziyo
icon-star
i-icon-star-engenanto
i icon-umsebenzisi
icon-ifilimu
icon-th-enkulu
icon-th
icon-th-uluhlu
icon-ok
icon-susa
i icon-zoom-in
i icon-zoom-out
i icon-off
uphawu-umqondiso
icon-cog
icon-udoti
icon-ikhaya
icon-fayile
uphawu-ixesha
icon-indlela
icon-download-alt
i icon-download
icon-upload
icon-inbox
icon-play-isangqa
icon-phinda
i icon-ukuhlaziya
icon-uluhlu-alt
icon-lock
i-icon-flag
icon-headphones
icon-umthamo-off
icon-umthamo-phantsi
icon-umthamo-up
icon-qrcode
icon-barcode
icon-tag
icon-tags
icon-ncwadi
icon-bookmark
icon-print
icon-ikhamera
ifonti yomfanekiso
i icon-engqindilili
i-icon-italic
icon-text-ubude
i icon-text-width
i-icon-lungelelanisa-ekhohlo
i-icon-lungelelanisa-embindini
icon-align-right
icon-align-justify
Uluhlu lwe icon
i-icon-indent-ekhohlo
i-icon-indenti-ekunene
icon-facetime-vidiyo
umfanekiso-mfanekiso
icon-ipensile
i icon-map-marker
icon-lungisa
icon-tint
i icon-edit
icon-ukwabelana
i icon-jonga
icon-susa
icon-inyathelo-umva
icon-ngokukhawuleza-umva
i icon-umva
i icon-play
icon-pause
icon-stop
uphawu-phambili
icon-ngokukhawuleza-phambili
icon-inyathelo-phambili
i icon-khupha
icon-chevron-ekhohlo
icon-chevron-right
icon-plus-sign
uphawu-thabatha-uphawu
uphawu-susa-uphawu
uphawu-ok-uphawu
uphawu-mbuzo-uphawu
uphawu-ulwazi-uphawu
umfanekiso weskrini
icon-susa-isangqa
icon-ok-isangqa
icon-ban-isangqa
i icon-utolo-ekhohlo
icon-utolo-ekunene
uphawu-utolo-phezulu
icon-utolo-phantsi
icon-share-alt
i icon-resize- full
icon-resize-ncinci
icon-plus
icon-thabatha
icon-asterisk
uphawu-isikhuzo-uphawu
icon-isipho
icon-leaf
icon-umlilo
icon-eye-vula
icon-eye-vala
uphawu-isilumkiso-uphawu
icon-plane
icon-ikhalenda
icon-random
icon-comment
icon-umazibuthe
icon-chevron-up
icon-chevron-down
icon-retweet
icon-inqwelo yokuthenga
i icon-ifolda-vala
icon-ifolda-vula
i icon-resize-vertical
icon-resize-horizontal
icon-hdd
icon-bullhorn
icon-bell
icon-isatifiketi
icon-obhontsi-up
icon-obhontsi-phantsi
uphawu-isandla-ekunene
uphawu-isandla-ekhohlo
uphawu-isandla-phezulu
uphawu-isandla-phantsi
icon-isangqa-utolo-ekunene
icon-isangqa-utolo-ekhohlo
icon-isangqa-utolo-phezulu
icon-isangqa-utolo-phantsi
icon-globe
i icon-wrench
icon-imisebenzi
isihluzi-mfanekiso
icon-briefcase
icon-isikrini esigcweleyo

Iimpawu zeGlyphicons

IiGlyphicons Halflings azifumaneki simahla, kodwa ilungiselelo phakathi kweBootstrap kunye nabadali beGlyphicons benze oku kwenzeke ngaphandle kweendleko kuwe njengabaphuhlisi. Njengombulelo, siyakucela ukuba ubandakanye ikhonkco lokubuyela kwiiGlyphicons nanini na xa kunokwenzeka.

Kusetyenziswa kwanjani

Zonke ii-icon zifuna <i>ithegi eneklasi eyodwa, enesimaphambili nge icon-. Ukusebenzisa, beka le khowudi ilandelayo naphi na:

<i class = "icon-search" > </i>

Kukwakho nezimbo ezifumanekayo kwii-icon eziguqulweyo (ezimhlophe), ezenziwe zalungiswa ngeklasi enye eyongezelelweyo. Siza kunyanzelisa ngokukodwa le klasi kwi-hover kunye neendawo ezisebenzayo ze-nav kunye nekhonkco lokuhla.

<i class = "icon-search icon-white" > </i>

Iintloko phezulu!Xa usebenzisa ecaleni kwemitya yokubhaliweyo, njengakumaqhosha okanye amakhonkco e-nav, qiniseka ukuba ushiya isithuba emva <i>kwethegi yesithuba esifanelekileyo.

Imizekelo yoMfanekiso

Zisebenzise kumaqhosha, amaqela amaqhosha ebar yesixhobo, ukukhangela, okanye amagalelo efomu esele ibekiwe.

Amaqhosha

Iqela leqhosha kwibar yesixhobo yeqhosha

<div class = "btn-toolbar" > 
  <div iklasi = "iqela le-btn" > 
    <a iklasi = "btn" href = "#" ><i class = "icon-align-left" ></i></a>   
    <a iklasi = "btn" href = "#" ><i class = "icon-align-center" ></i></a>   
    <a iklasi = "btn" href = "#" ><i class = "icon-align-right" ></i></a>   
    <a iklasi = "btn" href = "#" ><i class = "icon-align-justify" ></i></a>   
  </ div>
</ div>

Ukwehla kwiqela lamaqhosha

Umsebenzisi

<div iklasi = "iqela le-btn" > 
  <a class = "btn btn-primary" href = "#" ><i class = "icon-user icon-white" ></i> Umsebenzisi </a>   
  <a class = "btn btn-primary dropdown-toggle" data-toggle = "dropdown" href = "#" ><span class = "caret" ></span></a>    
  <ul class = "dropdown-menu" > 
    <li><a href = "#" ><i class = "icon-pensile" ></i> Hlela </a></li>  
    <li><a href = "#" ><i class = "icon-trash" ></i> Cima </a></li>  
    <li><a href = "#" ><i class = "icon-ban-isangqa" ></i> Vala </a> </li>  
    <li iklasi = "umahluli" > </ li> 
    <li><a href = "#" ><i class = "i" ></i> Yenza umlawuli </a></li>  
  </ul>
</ div>

Ubungakanani beqhosha

inkwenkwezi inkwenkwezi inkwenkwezi

<a class = "btn btn-large" href = "#" ><i class = "icon-star" ></i> Star </a>   
<a class = "btn btn-small" href = "#" ><i class = "icon-star" ></i> Star </a>   
<a class = "btn btn-mini" href = "#" ><i class = "icon-star" ></i> Star </a>

Ukukhangela

<ul class = "nav nav-list" > 
  <li iklasi = "esebenzayo" ><a href = "#" ><i class = "i-icon-yekhaya icon-emhlophe" ></i> Ekhaya </a></li>   
  <li><a href = "#" ><i class = "icon-book" ></i> Library </a></li>  
  <li><a href = "#" ><i class = "icon-pensile" ></i> Usetyenziso </a></li>  
  <li><a href = "#" ><i class = "i" ></i> Okuninzi </a> </li>  
</ul>

Imimandla yeefom

<div class = "control-group" > 
  <label class = "control-label" for = "inputIcon" > Idilesi ye -imeyile </label>  
  <div class = "controls" > 
    <div class = "input-prepend" > 
      <span class = "yongeza-on" ><i class = "icon-mvulophu" ></i></span>  
      <input class = "span2" id = "inputIcon" type = "text" >   
    </ div>
  </ div>
</ div>

Ukuchwetheza

Izihloko

h1. Isihloko 1

h2. Isihloko 2

h3. Isihloko 3

h4. Isihloko 4

h5. Isihloko 5

h6. Isihloko 6

Ikopi yomzimba

Ikopi yomzimba okhokelayo

Yakhiwe ngeNcinci

Ugxininiso

<small>

Engqindilili

akekeliswe sithi

Iiklasi zokulungelelanisa

Iiklasi zokugxininisa

Ushunqulelo

<abbr>

<abbr class="initialism">

Iidilesi

<address>

Iingcaphuno zebhloko

I-blockquote ehlala ikho

Iinketho zeBlockquote

Ukuchaza umthombo

Enye imiboniso

Uluhlu

Ayiodolwanga

Iodolwe

Ayifakwanga isimbo

Nomgca

Inkcazo

Inkcazo ethe tye

Ikhowudi

Nomgca

Ibhloko esisiseko

Iitafile

Izimbo ezihlala zikhona

Iiklasi ozikhethelayo

.table-striped

.table-bordered

.table-hover

.table-condensed

Iiklasi zomqolo ozikhethelayo

Uphawulo lwetafile oluxhaswayo

Iifom

Izimbo ezihlala zikhona

Uyilo olukhethwayo

Khangela ifomu

Ifom engaphakathi

Ifom ethe tye

Ulawulo lweefomu ezixhaswayo

Igalelo

Textarea

Iibhokisi zokutshekisha kunye noonomathotholo

Okuhlala kukho (kupakishwe)

Iibhokisi zokujonga ngaphakathi

Ikhetha

Ukwandiswa kolawulo lweefom

Amagalelo angaphambili nafakelweyo

Ukhetho oluhlala lukhona

Idityanisiwe

Amaqhosha endaweni yombhalo

Amaqhosha okwehla

Amaqela okwehla acandiweyo

Khangela ifomu

Lawula ubungakanani

Block amagalelo kwinqanaba

Ubungakanani obuhambelanayo

Ubungakanani begridi

Amagalelo angenakuhleleleka

Iintshukumo zefom

Umbhalo woncedo

Uncedo lwangaphakathi

Vimba uncedo

Iimeko zolawulo lwefom

Ugqaliselo lwegalelo

Ungeniso olungasebenziyo

Amagalelo avaliwe

`<small>`

`<abbr>`

`<abbr class="initialism">`

`<address>`

`.table-striped`

`.table-bordered`

`.table-hover`

`.table-condensed`