Imitwe

Imitwe yose ya HTML, <h1>binyuze <h6>irahari.

h1. Umutwe 1

h2. Umutwe 2

h3. Umutwe 3

h4. Umutwe 4

h5. Umutwe 5

h6. Umutwe 6

Kopi yumubiri

Ubusanzwe Bootstrap isanzwe font-sizeni 14px , hamwe line-heightna 20px . Ibi birakoreshwa kuri i <body>na paragarafu zose. Mubyongeyeho, <p>(paragarafu) yakira igice cyo hasi cyigice cyumurongo-muremure (10px kubwa mbere).

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

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

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

<p> ... </p>

Kiyobora umubiri

Kora igika kigaragara wongeyeho .lead.

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

<p urwego = "kuyobora" > ... </p>

Yubatswe na Buke

Igipimo cyimyandikire ishingiye kubintu bibiri BIKORESHEJWE mubihinduka.less : @baseFontSizena @baseLineHeight. Iya mbere ni ishingiro ryimyandikire-nini ikoreshwa mugihe cyose naho icya kabiri ni umurongo-muremure. Dukoresha ibyo bihinduka hamwe nimibare yoroshye yo gukora marge, padi, hamwe numurongo-muremure wubwoko bwacu nibindi byinshi. Hindura kandi uhindure imiterere ya Bootstrap.

Shimangira

Koresha HTML yibanze yibanze hamwe nuburyo bworoshye.

`<small>`

Kugirango ushimangire kumurongo cyangwa guhagarika inyandiko, koresha tagi nto.

Uyu murongo winyandiko ugenewe gufatwa nkicapiro ryiza.

<p> <small> Uyu murongo winyandiko ugenewe gufatwa nkicapiro ryiza. </small> </p>

Ubutinyutsi

Kubitsindagira agace k'inyandiko hamwe n'imyandikire iremereye.

Igice gikurikira cyinyandiko gitangwa nkinyandiko itinyutse .

<strong> yahinduwe nk'inyandiko itinyutse </strong>

Ubutaliyani

Kubitsindagira agace k'inyandiko hamwe na italike.

Igice gikurikira cyinyandiko gitangwa nkinyandiko itomoye .

<em> yahinduwe nk'inyandiko itomoye </em>

Umutwe!Wumve neza ko ukoresha <b>no <i>muri HTML5. <b>igamije kwerekana amagambo cyangwa interuro uterekanye akamaro kiyongereye mugihe <i>ahanini ari ijwi, amagambo ya tekiniki, nibindi.

Guhuza amasomo

Byoroshye guhindura inyandiko kubice hamwe nibyiciro byo guhuza inyandiko.

Ibumoso bwahujwe.

Hagati ihuza inyandiko.

Umwandiko uhujwe neza.

<p urwego = "inyandiko-ibumoso" > Ibumoso bwahujwe ninyandiko. </p> 
<p urwego = "umwandiko-hagati" > Ikigo cyahujwe ninyandiko. </p> 
<p urwego = "inyandiko-iburyo" > Umwandiko uhujwe neza. </p>

Shimangira amasomo

Tanga ibisobanuro ukoresheje ibara hamwe nintoki zo gushimangira amasomo yingirakamaro.

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

Etiam porta sem maleuada magna mollis euismod.

Donec 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 class = "muted" > Fusce dapibus, tellus ac cursus commodo, iyicarubozo mauris nibh. </p> 
<p urwego = "inyandiko-iburira" > Etiam porta sem maleuada magna mollis euismod. </p> 
<p urwego = "inyandiko-ikosa" > Donec ullamcorper nulla non metus auctor fringilla. </p> 
<p urwego = "inyandiko-amakuru" > Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis. </p> 
<p urwego = "inyandiko-intsinzi" > Duis mollis, est non commodo luctus, nisi erat porttitor ligula. </p>

Amagambo ahinnye

Gushyira mubikorwa uburyo bwa HTML <abbr>kubintu bigufi hamwe namagambo ahinnye kugirango yerekane verisiyo yagutse kuri hover. Amagambo ahinnye afite titleikiranga afite urumuri rudomo ruri munsi yumupaka hamwe nubufasha indanga kuri hover, itanga ibisobanuro byinyongera kuri hover.

`<abbr>`

Kubwinyandiko yagutse kumurongo muremure wamagambo ahinnye, shyiramo titleikiranga.

Amagambo ahinnye yijambo ikiranga ni attr .

<abbr umutwe = "ikiranga" > attr </abbr>

`<abbr class="initialism">`

Ongeraho .initialismmu magambo ahinnye yimyandikire ntoya.

HTML nikintu cyiza kuva gukata imigati.

<abbr umutwe = "HyperText Markup Ururimi" urwego = " intangiriro" > HTML </abbr>

Aderesi

Tanga amakuru yamakuru kuri ba sogokuruza hafi cyangwa umubiri wose wakazi.

`<address>`

Komeza imiterere urangiza imirongo yose hamwe <br>.

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

Izina ryuzuye
[email protected]

<adresse>
  <strong> Twitter, Inc </strong> <br>
  795 Inzira ya Folsom, Suite 600 <br>
  San Francisco, CA 94107 <br>
  <abbr umutwe = "Terefone" > P: </abbr> (123) 456-7890 
</adress>
 
<adresse>
  <strong> Izina ryuzuye </strong> <br>
  <a href = "mailo:#"> [email protected] </a> _ 
</adress>

Inzitizi

Kugirango usubiremo ibice bikubiye mubindi bisobanuro biri mu nyandiko yawe.

Mburabuzi

Kuzenguruka <blockquote>kuri HTML iyo ari yo yose. Kubisobanuro bigororotse turasaba a <p>.

Lorem ipsum dolor icara amet, consectetur adipiscing elit. Byuzuye posuere erat ante.

<blockquote>
  <p> Lorem ipsum dolor icara amet, consectetur adipiscing elit. Byuzuye posuere erat ante. </p>
</blockquote>

Guhitamo

Imiterere nibirimo bihinduka kubintu byoroshye gutandukana kumurongo usanzwe.

Kwita izina isoko

Ongeraho <small>tagi kugirango umenye inkomoko. Kuzuza izina ryinkomoko yakazi muri <cite>.

Lorem ipsum dolor icara amet, consectetur adipiscing elit. Byuzuye posuere erat ante.
Umuntu uzwi muri Source Umutwe

<blockquote>
  <p> Lorem ipsum dolor icara amet, consectetur adipiscing elit. Byuzuye posuere erat ante. </p>
  <small> Umuntu uzwi <cite umutwe = "Umutwe w'isoko" > Umutwe w'inkomoko </cite> </small> 
</blockquote>

Ubundi buryo bwo kwerekana

Koresha .pull-rightkureremba, guhuza iburyo.

Lorem ipsum dolor icara amet, consectetur adipiscing elit. Byuzuye posuere erat ante.
Umuntu uzwi muri Source Umutwe

<guhagarika icyiciro = "gukurura-iburyo" > 
  ...
</blockquote>

Urutonde

Urutonde rwibintu bitondekanya neza .

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

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

Rutegetse

Urutonde rwibintu byateganijwe bifite akamaro.

Lorem ipsum dolor icara amet
Consectetur adipiscing elit
Integer molestie lorem kuri massa
Facilisis muri pretium nisl aliquet
Nulla volutpat aliquam velit
Faucibus porta lacus fringilla vel
Aenean bicara amet erat nunc
Eget porttitor lorem

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

Unstyled

Kuraho ibisanzwe list-stylen'ibumoso padding kurutonde (abana bahita gusa).

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

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

Umurongo

Shira ibintu byose kurutonde kumurongo umwe hamwe inline-blockna padi yoroheje.

Lorem ipsum
Phasellus iaculis
Nulla volutpat

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

Ibisobanuro

Urutonde rwamagambo hamwe nibisobanuro bifitanye isano.

Urutonde rwibisobanuro: Urutonde rwibisobanuro ni rwiza rwo gusobanura amagambo.
Euismod: Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.; Donec id elit non mi porta gravida kuri eget metus.
Malesuada porta: Etiam porta sem maleuada magna mollis euismod.

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

Ibisobanuro bitambitse

Kora amagambo nibisobanuro <dl>kumurongo kumurongo.

Urutonde rwibisobanuro: Urutonde rwibisobanuro ni rwiza rwo gusobanura amagambo.
Euismod: Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.; Donec id elit non mi porta gravida kuri eget metus.
Malesuada porta: Etiam porta sem maleuada magna mollis euismod.
Felis euismod semper eget lacinia: Fusce dapibus, tellus ac cursus commodo, iyicarubozo mauris condimentum nibh, ut fermentum massa justo icara amet risus.

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

Umutwe!Urutonde rwibisobanuro bitambitse bizagabanya amagambo maremare cyane kugirango ahuze ibumoso bwiburyo text-overflow. Mubyerekezo bigufi, bizahinduka muburyo busanzwe buteganijwe.

Umurongo

Kuzuza ibice bya kode hamwe <code>.

Kurugero, <section>bigomba gupfunyika nkumurongo.

Kurugero , <code > & lt ; igice & gt ; </ code > bigomba gupfunyika nkumurongo .

Inzitizi y'ibanze

Koresha <pre>imirongo myinshi ya code. Witondere guhunga inguni iyo ari yo yose muri kode kugirango itangwe neza.

<p> Icyitegererezo hano ... </p>

<pre>
  & lt; p & gt; Inyandiko y'icyitegererezo hano ... & lt; / p & gt;
</pre>

Umutwe!Witondere kubika code muri <pre>tagi hafi ibumoso bushoboka; Bizatanga ibisobanuro byose.

Urashobora guhitamo kongeramo urwego .pre-scrollableruzashyiraho max-uburebure bwa 350px hanyuma utange y-axis umuzingo.

Imiterere isanzwe

Kuburyo bwibanze - urumuri rworoshye kandi rutandukanya gusa - ongeraho urwego shingiro .tablekuri buriwese <table>.

#	Izina	Izina ryanyuma	Izina ryukoresha
1	Ikimenyetso	Otto	@mdo
2	Yakobo	Thornton	@fat
3	Larry	Inyoni	@twitter

<imbonerahamwe yimeza = " imbonerahamwe" > 
  …
</table>

Amasomo atabishaka

Ongeraho icyaricyo cyose mubyiciro bikurikira murwego .tablerwibanze.

`.table-striped`

Ongeraho zebra-gukuramo umurongo uwo ariwo wose wameza imbere <tbody>unyuze kuri :nth-childCSS uhitamo (ntibiboneka muri IE7-8).

#	Izina	Izina ryanyuma	Izina ryukoresha
1	Ikimenyetso	Otto	@mdo
2	Yakobo	Thornton	@fat
3	Larry	Inyoni	@twitter

<imbonerahamwe yimeza = " imbonerahamwe yimeza" > 
  …
</table>

`.table-bordered`

Ongeraho imipaka hamwe nu mpande zegeranye kumeza.

#	Izina	Izina ryanyuma	Izina ryukoresha
1	Ikimenyetso	Otto	@mdo
1	Ikimenyetso	Otto	@ibikoresho
2	Yakobo	Thornton	@fat
3	Inyoni		@twitter

<imbonerahamwe yimeza = " imbonerahamwe yimbonerahamwe" > 
  …
</table>

`.table-hover`

Gushoboza kugendagenda kumeza kumurongo muri a <tbody>.

#	Izina	Izina ryanyuma	Izina ryukoresha
1	Ikimenyetso	Otto	@mdo
2	Yakobo	Thornton	@fat
3	Inyoni		@twitter

<imbonerahamwe yimeza = " imbonerahamwe yameza-hover" > 
  …
</table>

`.table-condensed`

Kora imbonerahamwe yoroheje mugukata padi mo kabiri.

#	Izina	Izina ryanyuma	Izina ryukoresha
1	Ikimenyetso	Otto	@mdo
2	Yakobo	Thornton	@fat
3	Inyoni		@twitter

<imbonerahamwe yimeza = " imbonerahamwe yimeza" > 
  …
</table>

Ibyiciro byumurongo

Koresha amasomo ajyanye n'amabara kumurongo.

Icyiciro	Ibisobanuro
`.success`	Yerekana igikorwa cyatsinze cyangwa cyiza.
`.error`	Yerekana ibikorwa biteje akaga cyangwa bishobora kuba bibi.
`.warning`	Yerekana umuburo ushobora gukenera kwitabwaho.
`.info`	Byakoreshejwe nkibisubizo byuburyo busanzwe.

#	Ibicuruzwa	Kwishura	Imiterere
1	Igituntu - Ukwezi	01/04/2012	Byemejwe
2	Igituntu - Ukwezi	02/04/2012	Yanze
3	Igituntu - Ukwezi	03/04/2012	Bitegereje
4	Igituntu - Ukwezi	04/04/2012	Hamagara kugirango wemeze

...
  < tr class = "intsinzi" >
    <td> 1 < / td>
    <td> Igituntu - Ukwezi </ td >
    < td > 01/04/2012 < / td >
    <td> Byemejwe </ td >
  </ tr >
...

Gushyigikirwa kumeza

Urutonde rwimbonerahamwe ya HTML yibintu nuburyo bigomba gukoreshwa.

Tag	Ibisobanuro
`<table>`	Gupfunyika ibintu byo kwerekana amakuru muburyo bwa mbonerahamwe
`<thead>`	Ibikoresho birimo kumeza umutwe wumurongo ( `<tr>`) kuranga imbonerahamwe yinkingi
`<tbody>`	Ibikoresho birimo kumeza kumurongo ( `<tr>`) mumubiri wameza
`<tr>`	Ibikoresho birimo ibice byameza ( `<td>`cyangwa `<th>`) bigaragara kumurongo umwe
`<td>`	Akazu gasanzwe
`<th>`	Imbonerahamwe idasanzwe ya selire yinkingi (cyangwa umurongo, bitewe nurwego no gushyira) ibirango
`<caption>`	Ibisobanuro cyangwa incamake y'ibyo imbonerahamwe ifata, cyane cyane ingirakamaro kubasoma ecran

<table>
  <caption> ... </caption>
  <umutwe>
    <tr>
      <th> ... </th>
      <th> ... </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td> ... </td>
      <td> ... </td>
    </tr>
  </tbody>
</table>

Imiterere isanzwe

Ifishi yumuntu kugiti cye yakira styling, ariko nta shingiro ryibanze risabwa kurwego <form>cyangwa impinduka nini mubimenyetso. Ibisubizo mubirindiro, ibumoso-bihujwe nibirango hejuru yuburyo bugenzura.

<form>
  <ikibanza>
    <legend> Umugani </legend>
    <label> Izina ryikirango </label>
    <iyinjiza ubwoko = "inyandiko" umwanya = "Andika ikintu…" >  
    <span class = "ubufasha-guhagarika" > Urugero rwo guhagarika urwego urwego rufasha inyandiko hano. </span> 
    <label class = "agasanduku k'isanduku" > 
      <iyinjiza ubwoko = "agasanduku" > Reba hanze 
    </label>
    <buto ubwoko = "gutanga" urwego = "btn" > Tanga </button>  
  </fieldset>
</form>

Imiterere idahwitse

Harimo na Bootstrap nuburyo butatu bwo guhitamo imiterere ikoreshwa mubisanzwe.

Ifishi yo gushakisha

Ongeraho .form-searchkumpapuro no .search-querykuri the <input>for the extra-rounded text input.

<form class = "form-shakisha" > 
  <iyinjiza ubwoko = "inyandiko" urwego = "icyinjijwe-gishakisha-ikibazo" >  
  <buto ubwoko = "gutanga" urwego = "btn" > Shakisha </button>  
</form>

Ifishi y'umurongo

Ongeraho .form-inlinekubumoso-buhujwe nibirango na inline-blok igenzura kumiterere.

<form class = "form-inline" > 
  <iyinjiza ubwoko = "inyandiko" urwego = "icyinjijwe-gito" umwanya = "Imeri" >   
  <iyinjiza ubwoko = "ijambo ryibanga" urwego = "icyinjijwe-gito" umwanya = "Ijambobanga" >   
  <label class = "agasanduku k'isanduku" > 
    <iyinjiza ubwoko = "agasanduku" > Unyibuke 
  </label>
  <buto ubwoko = "gutanga" urwego = "btn" > Injira </button>  
</form>

Ifishi itambitse

Kuringaniza iburyo hanyuma ukareremba ibumoso kugirango bigaragare kumurongo umwe nubugenzuzi. Irasaba impinduka nyinshi kuva muburyo busanzwe:

Ongeraho .form-horizontalkumpapuro
Kuzuza ibirango no kugenzura muri.control-group
Ongeraho .control-labelkuri label
Kuzuza ibiyobora byose bifitanye isano .controlskugirango uhuze neza

<form class = "form-horizontal" > 
  <div class = "kugenzura-itsinda" > 
    <ikirango icyiciro =  "kugenzura-ikirango" kuri = "kwinjizaEmail" > Imeri </label> 
    <div class = "igenzura" > 
      <iyinjiza ubwoko = "inyandiko"   id = "iyinjizaEmail" umwanya = "Imeri" > 
    </div>
  </div>
  <div class = "kugenzura-itsinda" >
    <label class = "kugenzura-ikirango"   kuri = "kwinjiza ijambo" > Ijambobanga </label>
    <div class = "igenzura" >
      <iyinjiza ubwoko = "ijambo ryibanga" id =   "kwinjiza ijambo" ijambo " umwanya = " Ijambobanga " > 
    </div>
  </div>
  <div class = "kugenzura-itsinda" >
    <div class = "igenzura" >
      <ikirango class = "agasanduku k'isanduku" >
        < Ubwoko bwinjiza = "agasanduku" > Unyibuke
      </label>
      <buto ubwoko = "gutanga" urwego = "btn"  > Injira </button>
    </div>
  </div>
</form>

Ifishi ifasha kugenzura

Ingero zuburyo busanzwe bugenzurwa bushyigikiwe nurugero rwimiterere.

Inyongeramusaruro

Byinshi mubisanzwe bigenzura, inyandiko-yinjiza imirima. Harimo inkunga kubwoko bwose bwa HTML5: inyandiko, ijambo ryibanga, igihe cyagenwe, igihe-cyaho, itariki, ukwezi, isaha, icyumweru, umubare, imeri, url, gushakisha, tel, nibara.

Irasaba gukoresha ikoreshwa ryihariye typeigihe cyose.

<iyinjiza ubwoko = "inyandiko" umwanya = "Inyandiko yinjiza" >

Textarea

Ifishi igenzura ishyigikira imirongo myinshi yinyandiko. Hindura rowsikiranga nkuko bikenewe.

< umurongo wa textarea = "3" > </textarea>

Agasanduku na radiyo

Kugenzura agasanduku ni uguhitamo kimwe cyangwa byinshi murutonde mugihe amaradiyo ari yo guhitamo inzira imwe muri benshi.

Ibisanzwe (byegeranye)

<label class = "agasanduku k'isanduku" > 
  <iyinjiza ubwoko = "agasanduku" agaciro = "" >  
  Icya mbere ni iki n'iki - menya neza gushyiramo impamvu ari nziza
</label>
 
<label class = "radio" > 
  <iyinjiza ubwoko = "radio" izina = "amahitamoRadios" id = "amahitamoRadios1" agaciro = "amahitamo1" yagenzuwe >     
  Icya mbere ni iki n'iki - menya neza gushyiramo impamvu ari nziza
</label>
<label class = "radio" > 
  <iyinjiza ubwoko = "radio" izina = "amahitamoRadios" id = "amahitamoRadios2" agaciro = "amahitamo2" >    
  Ihitamo rya kabiri rishobora kuba ikindi kandi guhitamo bizahitamo inzira imwe
</label>

Shyiramo agasanduku

Ongeraho .inlineurwego murukurikirane rwibisanduku cyangwa amaradiyo yo kugenzura bigaragara kumurongo umwe.

<label class = "agasanduku k'isanduku" > 
  <iyinjiza ubwoko = "agasanduku" id = "inlineCheckbox1" agaciro = "amahitamo1" > 1   
</label>
<label class = "agasanduku k'isanduku" > 
  <kwinjiza ubwoko = "agasanduku" id = "inlineCheckbox2" agaciro = "ihitamo2" > 2   
</label>
<label class = "agasanduku k'isanduku" > 
  <iyinjiza ubwoko = "agasanduku" id = "inlineCheckbox3" agaciro = "amahitamo3" > 3   
</label>

Guhitamo

Koresha amahitamo asanzwe cyangwa werekane a multiple="multiple"kugirango werekane amahitamo menshi icyarimwe.

<hitamo>
  <option> 1 </option>
  <option> 2 </option>
  <option> 3 </option>
  <option> 4 </option>
  <option> 5 </option>
</select>
 
<hitamo byinshi = "byinshi" > 
  <option> 1 </option>
  <option> 2 </option>
  <option> 3 </option>
  <option> 4 </option>
  <option> 5 </option>
</select>

Kwagura ifishi igenzura

Wongeyeho hejuru yubushakashatsi buriho, Bootstrap ikubiyemo ibindi bikoresho byingirakamaro.

Byateganijwe kandi byongeweho inyongeramusaruro

Ongeraho inyandiko cyangwa buto mbere cyangwa nyuma yinyandiko yose ishingiye. Menya ko selectibintu bidashyigikiwe hano.

Amahitamo asanzwe

Kuzuza an .add-onna an inputhamwe nimwe mubyiciro bibiri kugirango witegure cyangwa wongere inyandiko mubyinjijwe.

<div class = "kwinjiza-kwitegura" > 
  <span class = "on-on" > @ </span> 
  <ibyiciro byinjiza = "span2" id = " byinjijwe byinjira " ubwoko = "umwandiko" umwanya = "Izina ryukoresha" >    
</div>
<div class = "kwinjiza-umugereka" > 
  <ibyinjira byinjira = "span2" id = " byinjijwemo " Ubwoko = "inyandiko" >   
  <span class = "ongeraho" > .00 </span> 
</div>

Hamwe

Koresha ibyiciro byombi hamwe nuburyo bubiri .add-onbwo kwitegura no kongeramo ibitekerezo.

<div class = "kwinjiza-kwitegura kwinjiza-umugereka" > 
  <span class = "ongeraho" > $ </span> 
  <ibyinjira byinjira = "span2" id = " byongeweho Byinjijwe byinjira" ubwoko = "inyandiko" >   
  <span class = "ongeraho" > .00 </span> 
</div>

Utubuto aho kuba inyandiko

Aho kugirango <span>wandike inyandiko, koresha a .btnkugirango uhuze buto (cyangwa ebyiri) kwinjiza.

<div class = "kwinjiza-umugereka" > 
  <Iyinjiza Icyiciro =  "span2" = " byongewehoInputButton" ubwoko = "inyandiko" >  
  <buto  icyiciro = "btn" ubwoko = "buto" > Genda! </button> 
</div>

<div class = "kwinjiza-umugereka" > 
  <ibyinjira byinjira = " span2 " id   " byongewehoIbikoresho Byinjira" ubwoko = "inyandiko" > 
  <buto icyiciro = "btn"   ubwoko = "buto" > Shakisha </button>
  <buto icyiciro = "btn"   ubwoko = "buto" > Amahitamo </button>
</div>

Ibitonyanga

<div class = "kwinjiza-umugereka" >
  <ibyiciro byinjiza = "span2" id = " byongewehoDropdownButton"    ubwoko = "inyandiko" >
  <div class = "btn-itsinda" >
    <buto icyiciro = "btn kumanuka-guhinduranya"   data-toggle = "igitonyanga" >
      Igikorwa
      < icyiciro  = "caret" > </span>
    </button>
    <ul urwego  = "ibitonyanga-menu" >
      ...
    </ul>
  </div>
</div>

<div class = "kwinjiza-kwitegura" > 
  <div class = "btn-itsinda" > 
    <buto icyiciro = "btn kumanuka-guhinduranya" data-toggle = "igitonyanga" >  
      Igikorwa
      <span class = "caret" > </span> 
    </button>
    <ul class = "ibitonyanga-menu" > 
      ...
    </ul>
  </div>
  <ibyinjira byinjira = "span2" id = " byateganijweDropdownButton " ubwoko = "inyandiko" >   
</div>

<div class = "kwinjiza-kwitegura kwinjiza-umugereka" >
  <div class = "btn-itsinda" > 
    <buto icyiciro = "btn kumanuka-guhinduranya" data-toggle = "igitonyanga"  >
      Igikorwa
      <span class = "caret" > </span> 
    </button>
    <ul class = "ibitonyanga-menu" > 
      ...
    </ul>
  </div>
  <ibyiciro byinjiza = "span2" id = " byongewehoByongereweDropdownButton" ubwoko = "inyandiko" >   
  <div class = "btn-itsinda" > 
    <buto icyiciro = "btn kumanuka-guhinduranya" data-toggle = "igitonyanga" >  
      Igikorwa
      <span class = "caret" > </span> 
    </button>
    <ul class = "ibitonyanga-menu" > 
      ...
    </ul>
  </div>
</div>

Amatsinda yatonywe

<form>
  <div class = "kwinjiza-kwitegura" > 
    <div class = "btn-itsinda" > ... </div> 
    <iyinjiza ubwoko = "inyandiko" > 
  </div>
  <div class = "kwinjiza-umugereka" > 
    <iyinjiza ubwoko = "inyandiko" > 
    <div class = "btn-itsinda" > ... </div> 
  </div>
</form>

Ifishi yo gushakisha

<form class = "form-shakisha" > 
  <div class = "kwinjiza-umugereka" > 
    <iyinjiza ubwoko = "inyandiko" urwego = "span2 gushakisha-kubaza" >  
    <buto ubwoko = "gutanga" urwego = "btn" > Shakisha </button>  
  </div>
  <div class = "kwinjiza-kwitegura" > 
    <buto ubwoko = "gutanga" urwego = "btn" > Shakisha </button>  
    <iyinjiza ubwoko = "inyandiko" urwego = "span2 gushakisha-kubaza" >  
  </div>
</form>

Kugenzura ingano

Koresha ubunini bugereranije ibyiciro nka .input-largecyangwa uhuze ibisubizo byawe kuri grid inkingi ukoresheje.span* amasomo.

Hagarika urwego rwinjiza

Kora ikintu icyo aricyo cyose <input>cyangwa <textarea>ikintu witware nkurwego rwo guhagarika urwego.

<ibyinjira byinjira = "ibyinjijwe-guhagarika-urwego" ubwoko = " umwandiko" umwanya = ".input-block-urwego" >

Ingano igereranijwe

<ibyinjira byinjira = " iyinjiza-mini" ubwoko = "inyandiko" umwanya = ".input-mini" >   
<ibyinjira byinjira = " ibyinjijwe-bito" ubwoko = "inyandiko" umwanya = ".yinjiza-nto" >   
<ibyinjira byinjira = " icyinjijwe - giciriritse" ubwoko = "umwandiko" umwanya = ".yinjiza-hagati" >   
<ibyinjira byinjira = " ibyinjijwe-binini" ubwoko = "inyandiko" umwanya = ".input-nini" >   
<ibyinjira byinjira = " ibyinjijwe-xlarge" ubwoko = "umwandiko" umwanya = ".input-xlarge" >   
<ibyinjira byinjira = "ibyinjijwe-xxlarge" ubwoko = " umwandiko" umwanya = ".input-xxlarge" >

Umutwe!Mugihe kizaza, tuzahindura imikoreshereze yibi byiciro byinjira kugirango duhuze ingano ya buto. Kurugero,.input-large bizongera padding na font-ingano yinjiza.

Ingano nini

Koresha .span1Kuri .span12inyongeramusaruro zihuye nubunini bumwe bwa grid inkingi.

<ibyiciro byinjiza = "span1" ubwoko = " inyandiko" umwanya = ".span1" >   
<ibyinjira byinjira = "span2" ubwoko = " inyandiko" umwanya = ".span2" >   
<ibyinjira byinjira = "span3" ubwoko = " inyandiko" umwanya = ".span3" >   
<hitamo urwego = "span1" > 
  ...
</select>
<hitamo urwego = "span2" > 
  ...
</select>
<hitamo urwego = "span3" > 
  ...
</select>

Kuri grid nyinshi zinjiza kumurongo, koresha .controls-rowicyiciro cya modifier kumwanya ukwiye . Ireremba inyongeramusaruro kugirango isenywe cyera-umwanya, ishyiraho imipaka ikwiye, kandi ikuraho ikireremba.

<div class = "igenzura" > 
  <ibyiciro byinjiza = "span5" ubwoko = " inyandiko" umwanya = ".span5" >   
</div>
<div class = "igenzura kugenzura-umurongo" > 
  <ibyinjira byinjira = "span4" ubwoko = " inyandiko" umwanya = ".span4" >   
  <ibyiciro byinjiza = "span1" ubwoko = " inyandiko" umwanya = ".span1" >   
</div>
...

Inyongeramusaruro

Tanga amakuru muburyo budashobora guhindurwa udakoresheje ibimenyetso bifatika.

<span class = "iyinjiza-xlarge idahinduka-yinjiza" > Agaciro kamwe hano </span>

Shiraho ibikorwa

Kurangiza ifishi hamwe nitsinda ryibikorwa (buto). Iyo ishyizwe muri a .form-actions, buto izahita yerekana umurongo hamwe nuburyo bugenzura.

<div class = "form-ibikorwa" > 
  <buto ubwoko = "gutanga" urwego = "btn btn-primaire" > Bika impinduka </button>  
  <buto ubwoko = "buto" urwego = "btn" > Hagarika </button>  
</div>

Gufasha inyandiko

Shyira kumurongo hamwe no guhagarika urwego rwubufasha bugaragara hafi yuburyo bugenzura.

Gufasha

<iyinjiza ubwoko = "inyandiko" > <span class = "ubufasha-umurongo" > Inline ifasha inyandiko </span>

Hagarika ubufasha

<iyinjiza ubwoko = "inyandiko" > <span class = "ubufasha-guhagarika" > Inzira ndende yubufasha bwanditse buva kumurongo mushya kandi bushobora kwaguka kurenza umurongo umwe. </span>

Kugenzura imiterere

Tanga ibitekerezo kubakoresha cyangwa abashyitsi hamwe nibitekerezo byibanze byerekana kumpapuro zigenzura na labels.

Kwinjiza intumbero

Dukuraho outlineimisusire isanzwe kumpapuro zimwe na zimwe igenzura hanyuma tugashyira a box-shadowmu mwanya wabyo :focus.

<ibyinjira byinjira = " ibyinjijwe-xlarge" id = "yibanzeIyinjiza" ubwoko = "inyandiko" agaciro = "Ibi byibanze ..." >

Inyongeramusaruro zitemewe

Imisusire yinjiza binyuze mumikorere ya mushakisha isanzwe hamwe :invalid. Kugaragaza a type, ongeraho requiredikiranga niba umurima utabishaka, kandi (niba bishoboka) vuga a pattern.

Ibi ntibiboneka muri verisiyo ya Internet Explorer 7-9 kubera kubura inkunga kubatoranya CSS pseudo.

<ibyinjira byinjira = "span3" ubwoko = " imeri" bisabwa >

Inyongeramusaruro

Ongeraho disabledikiranga kumurongo winjiza kugirango wirinde abakoresha kwinjiza kandi utere isura itandukanye.

<ibyinjira byinjira = " ibyinjijwe-xlarge" id = "ubumuga bwinjiza" ubwoko = "umwandiko" umwanya = "Kwinjiza hano hano ..." byahagaritswe >

Kwemeza

Bootstrap ikubiyemo uburyo bwo kwemeza amakosa, kuburira, amakuru, nubutumwa bwatsinze. Gukoresha, ongeraho ibyiciro bikwiye kuruhande .control-group.

<div class = "kugenzura-itsinda ryo kuburira" > 
  <label class = "kugenzura-label" ya = "kwinjizaIburira" > Iyinjiza hamwe no kuburira </label>  
  <div class = "igenzura" > 
    < ubwoko bwinjiza = "inyandiko" id = "kwinjizaIburira" >  
    <span class = "ubufasha-inline" > Ikintu gishobora kuba kitaragenze neza </span> 
  </div>
</div>
 
<div class = "kugenzura-itsinda ryamakosa" > 
  <label class = "igenzura-ikirango" kuri = "IkosaError" > Iyinjiza hamwe nikosa </label>  
  <div class = "igenzura" > 
    < ubwoko bwinjiza = "inyandiko" id = "ikosaError" >  
    <span class = "ubufasha-inline" > Nyamuneka ukosore ikosa </span> 
  </div>
</div>
 
<div class = "kugenzura-itsinda ryamakuru" > 
  <label class = "kugenzura-label" ya = "kwinjizaInfo" > Iyinjiza hamwe namakuru </label>  
  <div class = "igenzura" > 
    < ubwoko bwinjiza = "inyandiko" id = "iyinjizaInfo" >  
    <span class = "ubufasha-inline" > Izina ryukoresha rimaze gufatwa </span> 
  </div>
</div>
 
<div class = "kugenzura-itsinda gutsinda" > 
  <label class = "igenzura-ikirango" kuri = "kwinjizaSuccess" > Iyinjiza hamwe nitsinzi </label>  
  <div class = "igenzura" > 
    < ubwoko bwinjiza = "inyandiko" id = "ibyinjijwe Intsinzi" >  
    <span class = "ubufasha-inline" > Woohoo! </span> 
  </div>
</div>

Mburabuzi

Imisusire ya buto irashobora gukoreshwa kubintu byose hamwe .btnnishuri ryakoreshejwe. Ariko, mubisanzwe uzashaka kubishyira mubikorwa gusa <a>nibintu <button>byo gutanga neza.

Button	icyiciro = ""	Ibisobanuro
	`btn`	Akabuto gasanzwe keza hamwe na gradient
	`btn btn-primary`	Itanga uburemere bwinyongera bugaragara kandi ikagaragaza ibikorwa byibanze murwego rwa buto
	`btn btn-info`	Byakoreshejwe nkibisubizo byuburyo busanzwe
	`btn btn-success`	Yerekana igikorwa cyatsinze cyangwa cyiza
	`btn btn-warning`	Irerekana ubwitonzi bugomba gufatwa niki gikorwa
	`btn btn-danger`	Yerekana ibikorwa biteje akaga cyangwa bishobora kuba bibi
	`btn btn-inverse`	Ubundi umwijima wijimye wijimye, ntabwo uhujwe nigikorwa cyo gusobanura cyangwa gukoresha
	`btn btn-link`	Shimangira buto mugukora nkumuhuza mugihe ukomeza imyitwarire ya buto

Guhuza amashakiro

IE9 ntisarura inyuma ya gradients kumpande zegeranye, nuko turayikuraho. Bifitanye isano, IE9 ihindura buttonibintu byamugaye, ihindura inyandiko imvi hamwe ninyandiko mbi-igicucu tudashobora gukosora.

Ingano ya buto

Ibyiza binini cyangwa bito? Ongeraho .btn-large, .btn-smallcyangwa .btn-minikubindi binini.

<p>
  <buto icyiciro = "btn btn-nini ya btn-primaire" ubwoko = "buto" > Akabuto kanini </button>  
  <buto icyiciro = "btn btn-nini" ubwoko = "buto" > buto nini </button>  
</p>
<p>
  <buto icyiciro = "btn btn-primaire" ubwoko = "buto" > Akabuto gasanzwe </button>  
  <buto icyiciro = "btn" ubwoko = "buto" > Akabuto gasanzwe </button>  
</p>
<p>
  <buto icyiciro = "btn btn-nto btn-primaire" ubwoko = "buto" > Akabuto gato </button>  
  <buto icyiciro = "btn btn-nto" ubwoko = "buto" > Akabuto gato </button>  
</p>
<p>
  <buto icyiciro = "btn btn-mini btn-primaire" ubwoko = "buto" > Akabuto gato </button>  
  <buto icyiciro = "btn btn-mini" ubwoko = "buto" > Akabuto gato </button>  
</p>

Kora urwego rwo guhagarika buto-izenguruka ubugari bwuzuye bwababyeyi - wongeyeho .btn-block.

<buto icyiciro = "btn btn-nini ya btn-guhagarika btn-primaire" ubwoko = "buto" > Guhagarika urwego urwego </button>  
<buto icyiciro = "btn btn-nini ya btn-guhagarika" ubwoko = "buto" > Guhagarika urwego urwego </button>

Leta yamugaye

Kora utubuto dusa nkudakunzwe mugusubira inyuma 50%.

Ikintu cya Anchor

Ongeraho urwego .disabledkuri <a>buto.

Ihuza ryibanze Ihuza

< a href = " _ _ _ _ _  
<a href = "#" class = "btn btn-geza abamugaye"> Ihuza </a>

Umutwe!Dukoresha .disablednkibyiciro byingirakamaro hano, bisa nicyiciro rusange .active, ntabwo rero prefix isabwa. Na none, iri somo ni ryiza gusa; ugomba gukoresha JavaScript yihariye kugirango uhagarike amahuza hano.

Ikintu cya buto

Ongeramo disabledikiranga kuri <button>buto.

<buto ubwoko = "buto" urwego = "btn btn-nini ya btn-ibanze yamugaye" ubumuga = "ubumuga" > Akabuto kambere </button>   
<buto ubwoko = "buto" urwego = "btn btn-nini" yamugaye > Buto </button>

Icyiciro kimwe, ibirango byinshi

Koresha .btnicyiciro kuri an <a>, <button>cyangwa <input>element.

<a class = "btn" href = ""> Ihuza </a> _  
<buto icyiciro = "btn" ubwoko = "gutanga" > Buto </button>  
<ibyinjira byinjira = " btn" ubwoko = "buto" agaciro = "Iyinjiza" >   
<ibyinjira byinjira = " btn" ubwoko = "gutanga" agaciro = "Kohereza" >

Nkumwitozo mwiza, gerageza guhuza ibice kumiterere yawe kugirango wemeze guhuza kwambukiranya amashusho. Niba ufite an input, koresha an <input type="submit">kuri buto yawe.

Ongeraho amasomo kubintu <img>byoroshye gushushanya amashusho mumushinga uwo ariwo wose.

<img src = "..." urwego = "img-ruzengurutse" >  
<img src = "..." urwego = "img-ruziga" >  
<img src = "..." urwego = "img-polaroid" >

Umutwe! .img-roundedkandi .img-circlentukore muri IE7-8 kubera kubura border-radiusinkunga.

Agashusho glyphs

Udushushondanga 140 muburyo bwa spite, buraboneka mwijimye ryijimye (isanzwe) numweru, utangwa na Glyphicons .

agashusho-ikirahure
agashusho-umuziki
agashusho
igishushanyo-ibahasha
agashusho-umutima
Agashusho-inyenyeri
Agashusho-inyenyeri-ubusa
Agashusho-Umukoresha
Agashusho
igishushanyo-kinini
igishushanyo-th
Agashusho-Urutonde
agashusho-ok
agashusho-gukuramo
agashusho-zoom-in
agashusho-gukuramo
agashusho
Agashusho
Agashusho-cog
agashusho-imyanda
agashusho-murugo
Agashusho-Idosiye
Agashusho-Igihe
Agashusho-Umuhanda
agashusho-gukuramo-alt
agashusho
agashusho
Agasanduku-inbox
agashusho-gukina-uruziga
agashusho-subiramo
agashusho-kugarura
agashusho-urutonde-alt
agashusho-gufunga
agashusho-ibendera
agashusho-na terefone
Agashusho-inomero
agashusho-ingano-hasi
agashusho-hejuru-hejuru
agashusho-qrcode
Agashusho-barcode
Agashusho
Agashushondanga
agashusho-igitabo
Agashusho
Agashusho
agashusho-kamera
Agashusho-Imyandikire
Agashushondanga
Agashushondanga
agashusho-inyandiko-uburebure
agashusho-inyandiko-ubugari
agashusho-guhuza-ibumoso
agashusho-guhuza-hagati
agashusho-guhuza-iburyo
agashusho-guhuza-gutsindishiriza
Agashusho-Urutonde
agashusho-indent-ibumoso
agashusho-indent-iburyo
agashusho-isura-videwo
agashusho
Ikaramu-Ikaramu
Agashusho-Ikarita-Ikimenyetso
agashusho
Agashusho
Agashusho
agashusho-kugabana
agashusho-kugenzura
Agashusho
agashusho-intambwe-inyuma
agashusho-byihuse-inyuma
agashusho-inyuma
agashusho-gukina
Agashusho-Kuruhuka
agashusho
Agashusho-Imbere
Agashusho-byihuse-imbere
Agashusho-Intambwe-Imbere
agashusho
agashusho-chevron-ibumoso
agashusho-chevron-iburyo
agashusho-kongeramo-ikimenyetso
agashusho-gukuramo-ikimenyetso
agashusho-gukuramo-ikimenyetso
agashusho-ok-ikimenyetso
agashusho-ikibazo-ikimenyetso
agashusho-amakuru-ikimenyetso
Agashusho-Ishusho
agashusho-gukuramo-uruziga
agashusho-ok-uruziga
Agashusho-ban-uruziga
agashusho-umwambi-ibumoso
agashusho-umwambi-iburyo
agashusho-umwambi-hejuru
Agashusho-Umwambi-Hasi
agashusho-gusangira-alt
igishushanyo-cyuzuye-cyuzuye
agashusho-guhindura-nto
agashusho
agashusho-gukuramo
agashusho-inyenyeri
agashusho-gutangaza-ikimenyetso
Agashusho-Impano
agashusho
Agashusho-umuriro
agashusho-amaso
agashusho-ijisho-hafi
agashusho-kuburira-ikimenyetso
agashusho-indege
Agashusho
Agashushondanga
agashusho-igitekerezo
agashusho
agashusho-chevron-up
agashusho-chevron-hasi
agashusho-gusubiramo
agashusho-kugura-igare
Agashusho-Ububiko-Gufunga
Agashusho-Ububiko
agashusho-guhindura-guhagarikwa
agashusho-guhindura-gutambitse
agashusho-hdd
Agashusho
agashusho-inzogera
Agashusho-Icyemezo
agashusho-igikumwe-hejuru
agashusho-igikumwe-hasi
agashusho-ukuboko-iburyo
agashusho-ukuboko-ibumoso
agashusho-ukuboko
agashusho-ukuboko-hasi
Agashusho-Uruziga-Umwambi-iburyo
Agashusho-Uruziga-Umwambi-Ibumoso
Agashusho-Uruziga-Umwambi-hejuru
Agashusho-Uruziga-Umwambi-Hasi
agashusho-isi
Agashushondanga
agashusho-imirimo
Agashushondanga
agashusho-agasakoshi
igishushanyo-cyuzuye

Ikiranga Glyphicons

Glyphicons Halflings mubisanzwe ntabwo iboneka kubuntu, ariko gahunda hagati ya Bootstrap nabashizeho Glyphicons yatumye ibi bishoboka nta kiguzi kuri wewe nkabateza imbere. Nkugushimiye , turagusaba gushyiramo umurongo uteganijwe gusubira kuri Glyphicons igihe cyose bifatika.

Uburyo bwo gukoresha

Udushushondanga twose dusaba <i>ikirango hamwe nicyiciro cyihariye, cyashyizwe hamwe na icon-. Gukoresha, shyira kode ikurikira hafi aho ariho hose:

<i urwego = "igishushanyo-shakisha" > </i>

Hariho kandi uburyo buboneka kubishushanyo (byera) bishushanyo, bikozwe hamwe nicyiciro kimwe cyinyongera. Tuzashyira mubikorwa cyane cyane iri somo kuri hover na leta zikora kuri nav no kumanuka.

<i urwego = "igishushanyo-shakisha igishushanyo-cyera" > </i>

Umutwe!Mugihe ukoresheje kuruhande rwimirongo yinyandiko, nko muri buto cyangwa guhuza amahuza, menya neza ko usiga umwanya nyuma <i>yikimenyetso cyumwanya ukwiye.

Ingero

Koresha muri buto, buto ya matsinda kubikoresho byabigenewe, kugendagenda, cyangwa ifishi yateguwe.

Utubuto

Itsinda rya buto mumwanya wibikoresho

<div class = "btn-toolbar" > 
  <div class = "btn-itsinda" > 
    <a class = "btn" href = "#"> <i class = "agashusho-align-ibumoso" > </i> </a>   
    <a class = "btn" href = "#"> <i class = "icon-align-center" > </i> </a>   
    <a class = "btn" href = "#"> <i class = "agashusho-align-iburyo" > </i> </a>   
    <a class = "btn" href = "#"> <i class = "agashusho-guhuza-gutsindishiriza" > </i> </a>   
  </div>
</div>

Kumanuka mumatsinda ya buto

Umukoresha

<div class = "btn-itsinda" > 
  <a class = "btn btn-primary" href = "#"> <i class = "igishushanyo-ukoresha igishushanyo-cyera" > </i> Umukoresha </a>   
  <a class = "btn btn-ibanze byamanutse-toggle" data-toggle = "dropdown" href = "#"> <span class = "caret" > </span> </a>    
  <ul class = "ibitonyanga-menu" > 
    <li> <a href = "#"> <i class = "agashusho-ikaramu" > </i> Hindura </a> </li>  
    <li> <a href = "#"> <i class = "agashusho-imyanda" > </i> Gusiba </a> </li>  
    <li> <a href = "#"> <i class = "agashusho-ban-umuzenguruko" > </i> Ban </a> </li>  
    <li urwego = "umutandukanya" > </li> 
    <li> <a href = "#"> <i class = "i" > </i> Kora admin </a> </li>  
  </ul>
</div>

Ingano ya buto

Inyenyeri Inyenyeri Inyenyeri

<a class = "btn btn-large" href = "#"> <i class = "igishushanyo-inyenyeri" > </i> Inyenyeri </a>   
<a class = "btn btn-small" href = "#"> <i class = "igishushanyo-inyenyeri" > </i> Inyenyeri </a>   
<a class = "btn btn-mini" href = "#"> <i class = "igishushanyo-inyenyeri" > </i> Inyenyeri </a>

Kugenda

<ul class = "nav nav-urutonde" > 
  <li urwego = "rukora" > <a href = "#"> <i class = "agashusho-murugo igishushanyo-cyera" > </i> Urugo </a> </li>   
  <li> <a href = "#"> <i class = "igishushanyo-igitabo" > </i> Isomero </a> </li>  
  <li> <a href = "#"> <i class = "agashusho-ikaramu" > </i> Porogaramu </a> </li>  
  <li> <a href = "#"> <i class = "i" > </i> Misc </a> </li>  
</ul>

Shiraho imirima

<div class = "kugenzura-itsinda" > 
  <label class = "kugenzura-label" ya = "kwinjizaIcon" > Aderesi imeri </label>  
  <div class = "igenzura" > 
    <div class = "kwinjiza-kwitegura" > 
      <span class = "on-on" > <i class = "agashusho-ibahasha" > </i> </span>  
      <ibyinjira byinjira = "span2" id = " iyinjizaIcon" ubwoko = "inyandiko" >   
    </div>
  </div>
</div>

Imyandikire

Imitwe

h1. Umutwe 1

h2. Umutwe 2

h3. Umutwe 3

h4. Umutwe 4

h5. Umutwe 5

h6. Umutwe 6

Kopi yumubiri

Kiyobora umubiri

Yubatswe na Buke

Shimangira

<small>

Ubutinyutsi

Ubutaliyani

Guhuza amasomo

Shimangira amasomo

Amagambo ahinnye

<abbr>

<abbr class="initialism">

Aderesi

<address>

Inzitizi

Mburabuzi

Guhitamo

Kwita izina isoko

Ubundi buryo bwo kwerekana

Urutonde

Urutonde

Rutegetse

Unstyled

Umurongo

Ibisobanuro

Ibisobanuro bitambitse

Kode

Umurongo

Inzitizi y'ibanze

Imbonerahamwe

Imiterere isanzwe

Amasomo atabishaka

.table-striped

.table-bordered

.table-hover

.table-condensed

Ibyiciro byumurongo

Gushyigikirwa kumeza

Ifishi

Imiterere isanzwe

Imiterere idahwitse

Ifishi yo gushakisha

Ifishi y'umurongo

Ifishi itambitse

Ifishi ifasha kugenzura

Inyongeramusaruro

Textarea

Agasanduku na radiyo

Ibisanzwe (byegeranye)

Shyiramo agasanduku

Guhitamo

Kwagura ifishi igenzura

Byateganijwe kandi byongeweho inyongeramusaruro

Amahitamo asanzwe

Hamwe

Utubuto aho kuba inyandiko

Ibitonyanga

Amatsinda yatonywe

Ifishi yo gushakisha

Kugenzura ingano

Hagarika urwego rwinjiza

Ingano igereranijwe

Ingano nini

Inyongeramusaruro

Shiraho ibikorwa

Gufasha inyandiko

Gufasha

Hagarika ubufasha

Kugenzura imiterere

Kwinjiza intumbero

Inyongeramusaruro zitemewe

Inyongeramusaruro

`<small>`

`<abbr>`

`<abbr class="initialism">`

`<address>`

`.table-striped`

`.table-bordered`

`.table-hover`

`.table-condensed`