Fua lomitusi

O le fa'asologa atoa o fa'asologa o lo'o fa'avae i luga o le lua Less variables i la tatou faila faila.less: @baseFontSizema @baseLineHeight. O le mea muamua o le fa'amaufa'ailoga faavae-tele o lo'o fa'aogaina atoa ma le lona lua o le laina-maualuga fa'avae.

Matou te faʻaogaina na fesuiaiga, ma nisi numera, e fatu ai pito, paddings, ma laina-maualuga o matou ituaiga uma ma sili atu.

Fa'ata'ita'iga tusitusiga tino

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 ut id elit.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.

Fa'aaogaina o le faamamafa

Fusce dapibus , tellus ac cursus commodo , tortor mauris condimentum nibh , ut fermentum massa justo sit amet risus. Maecenas faucibus mollis interdum. Nulla vitae elit libero, a pharetra augue.

Manatua: Lagona le saoloto e faʻaoga <b>ma <i>i le HTML5, ae o lo latou faʻaogaina ua fai sina suiga. <b>e fa'atatau e fa'amanino ai upu po'o fasifuaitau e aunoa ma le fa'ailoaina atu o le taua ae <i>tele lava mo leo, upu fa'apitoa, ma isi.

Fa'ata'ita'iga tuatusi

O faʻataʻitaʻiga nei e lua o le faʻaogaina o le <address>pine:

Faataitaiga faapuupuuga

O fa'apuupuuga o lo'o fa'avasegaina i mata'itusi mata'itusi pito i luga ma se pito i lalo togitogi malamalama. E iai fo'i le latou fa'ailo fesoasoani i luga o le fa'afefete ina ia maua e tagata fa'aoga fa'ailoga fa'aopoopo o le a fa'aalia se mea i luga o le fa'afefe.

HTML o le mea sili lea talu mai le fasi falaoa.

O se faapuupuuga o le upu uiga o le attr .

Ina ia aofia ai se poloka upusii, afifi <blockquote>soo se HTML e pei o le upusii. Mo upusii tuusa'o matou te fautuaina se <p>.

Fa'aaofia se <small>elemene e filifili e ta'u mai ai lau puna'oa ma o le ae mauaina se fa'ailoga em i —luma atu mo fa'amoemoega fa'ailoga.

<blockquote>
  <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis. </p>
  <small> Se tasi ta'uta'ua </small>
</blockquote>

O upusii fa'apolokalame fa'aletonu e fa'apea:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis.

O se tasi ta'uta'ua i le Tino o galuega

Ina ia faʻafefe lau poloka upusii i le taumatau, faʻaopoopo class="pull-right":

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis.

O se tasi ta'uta'ua i le Tino o galuega

Le fa'atonu

<ul>

• Lorem ipsum dolor sit amet
• Consectetur adipiscing elit
• Integer molestie lorem ma masa
• Facilisis in pretium nisl aliquet
• Nulla volutpat aliquam velit
  • Phasellus iaculis neque
  • Purus sodales ultricies
  • Vestibulum laoreet porttitor sem
  • Ac tristique libero volutpat at
• Faucibus porta lacus fringilla vel
• Aenean nofo amet erat nunc
• Eget porttitor lorem

Le fa'ailoga

<ul class="unstyled">

• Lorem ipsum dolor sit amet
• Consectetur adipiscing elit
• Integer molestie lorem ma masa
• Facilisis in pretium nisl aliquet
• Nulla volutpat aliquam velit
  • Phasellus iaculis neque
  • Purus sodales ultricies
  • Vestibulum laoreet porttitor sem
  • Ac tristique libero volutpat at
• Faucibus porta lacus fringilla vel
• Aenean nofo amet erat nunc
• Eget porttitor lorem

Fa'atonu

<ol>

1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem ma masa
4. Facilisis in pretium nisl aliquet
5. Nulla volutpat aliquam velit
6. Faucibus porta lacus fringilla vel
7. Aenean nofo amet erat nunc
8. Eget porttitor lorem

Fa'amatalaga

<dl>

Lisi fa'amatalaga

Ole lisi fa'amatalaga e lelei atoatoa mo le fa'amalamalamaina o upu.

Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida and eget metus.

Malesuada porta

Etiam porta sem malesuada magna mollis euismod.

I totonu

Afifi fasi laina fa'ailoga fa'ailoga ma <code>.

Mo se fa'ata'ita'iga , <code> section </ code > e tatau ona afifi i totonu o le laina .  

Poloka faavae

Fa'aoga <pre>mo le tele o laina code. Ia mautinoa e su'e so'o se atigipusa i a latou mataitusi unicode mo le fa'aliliuga tatau.

<p>Fa'ata'ita'i tusitusiga iinei...</p>

<mua>
  <p>Fa'ata'ita'iga tusitusiga iinei...</p>
</pre>

Manatua: Ia mautinoa e teu le code i totonu o <pre>pine e latalata ile agavale pe a mafai; o le a tu'uina atu fa'amau uma.

Google Fa'alelei

Ave le <pre>elemene lava e tasi ma faʻaopoopo ni vasega se lua mo le faʻaleleia atili.

<p> Fa'ata'ita'i tusitusiga iinei... </p>

<pre class = "prettyprint 
     laina laina" >
  <p>Fa'ata'ita'iga tusitusiga iinei...</p>
</pre>

La'u mai le google-code-prettify ma va'ai le readme mo le fa'aogaina.

< laulau>
  <ulu>
    <tr>
      <th> … </th>
      <th> … </th>
    </tr>
  </head>
  <tino>
    <tr>
      <td> … </td>
      <td> … </td>
    </tr>
  </tino>
</ laulau>

E otometi lava ona fa'avasegaina laulau ma na'o ni nai tuaoi e mautinoa ai le faitau ma fa'atumauina le fausaga. Faatasi ai ma le 2.0, .tablee manaʻomia le vasega.

<table class = "table" > 
  …
</ laulau>

Fai sina fa'afiafiaga i au laulau e ala i le fa'aopoopoina o le zebra-striping—na'o le fa'aopoopoina o le .table-stripedvasega.

Fa'aaliga: E fa'aogaina e laulau fa'atasi le :nth-childCSS filifilia ma e le maua ile IE7-IE8.

< vasega laulau = "la'au laulau-garis" > 
  …
</ laulau>

Fa'aopoopo tuaoi fa'ata'amilo i le laulau atoa ma tulimanu lapotopoto mo fa'amoemoega fa'alelei.

<table class = "table table-bordered" > 
  …
</ laulau>

Fa'asili lau laulau e ala i le fa'aopoopoina o le .table-condensedvasega e tipi fa'afafa (mai le 8px i le 4px).

<table class = "table table-condensed" > 
  …
</ laulau>

Lagona le saoloto e tuʻufaʻatasia soʻo se vasega laulau e ausia ai foliga eseese e ala i le faʻaaogaina o soʻo se vasega avanoa.

<table class = "table table-striped table-bordered table-condensed" > 
  ...
</ laulau>

HTML ma CSS fetuutuunai

O le vaega pito sili ona lelei e uiga i fomu i Bootstrap o au faʻaoga uma ma faʻatonuga e foliga lelei tusa lava pe faʻafefea ona e fausia i lau faʻailoga. E leai se HTML e manaʻomia, ae matou te tuʻuina atu mamanu mo i latou e manaʻomia.

E sili atu le lavelave fa'atulagaina o lo'o sau fa'atasi ma vasega pupu'u ma fa'avasegaina mo le fa'agofieina o sitaili ma fa'apipi'i mea e tupu, o lea e ufiufi ai oe i la'asaga uma.

E fa fa'atulagaina na aofia ai

O le Bootstrap e sau ma le lagolago mo ituaiga faʻatulagaina o fomu:

• Tusa'o
• Saili
• I totonu
• Fa'asagaga

O ituaiga eseese o fomu fa'atulagaina e mana'omia ai ni suiga i le fa'ailoga, ae o le pule lava ia e tumau ma amio tutusa.

Pulea setete ma sili atu

O fomu a Bootstrap e aofia ai sitaili mo fa'atonuga uma e pei o fa'aoga, textarea, ma filifili e te fa'amoemoeina. Ae o lo'o sau fo'i ma le tele o vaega fa'ale-aganu'u e pei o mea fa'apipi'i ma fa'apipi'i muamua ma lagolago mo lisi o pusa siaki.

O setete e pei o mea sese, lapataiga, ma le manuia o loʻo aofia ai mo ituaiga taʻitasi o faʻatonuga. O lo'o iai fo'i sitaili mo fa'atonu fa'aletonu.

Faatasi ai ma le v2.0, e sili atu ona mama ma sili atu le poto o le faaletonu mo sitaili o foliga. Leai se fa'ailoga fa'aopoopo, na'o le fa'atonuga.

Fa'ata'ita'iina sitaili a le WebKit fa'aletonu, na'o le fa'aopoopo .form-searchmo isi fa'ata'amilosaga su'esu'e.

O mea fa'aoga o poloka poloka e amata ai. Mo .form-inlinema .form-horizontal, matou te faʻaogaina totonu-poloka.

O mea e aofia ai

O lo'o fa'aalia i le agavale o fa'atonuga fa'aletonu uma matou te lagolagoina. O le lisi lenei o pulufana:

• mea e fai ai tusitusiga (tusitusiga, upu faataga, imeli, ma isi)
• pusa siaki
• leitio
• filifili
• filifili tele
• faila faila
• textarea

Fa'aletonu fou ile v2.0

E o'o atu i le v1.4, o sitaili fa'ailoga a le Bootstrap na fa'aogaina ai le fa'alava fa'alava. Fa'atasi ai ma le Bootstrap 2, na matou 'ave'esea lena fa'agata ina ia sili atu le atamai, sili atu fa'aletonu fa'aletonu mo so'o se ituaiga.

Toe fa'atulagaina tulaga su'esu'e

Bootstrap fa'aalia sitaili mo su'esu'ega-lagolago taula'i ma disabledsetete. Matou te aveese le Webkit le lelei outlinema faʻaoga se box-shadowi lona nofoaga mo :focus.

Fa'amaonia pepa

E aofia ai foʻi sitaili faʻamaonia mo mea sese, lapataiga, ma le manuia. Ina ia faʻaaoga, faʻaopoopo le vasega sese i le siʻosiʻomaga .control-group.

<fieldset
  vasega = "pule-vaega sese" >
  …
</fieldset>

Fa'aopoopo ma fa'aopoopo mea e fai

Vaega fa'aofi—fa'atasi ai ma tusitusiga fa'apipi'i po'o fa'apipi'i muamua—e tu'uina atu se auala faigofie e tu'uina atu ai nisi fa'amatalaga mo au mea e fai. O fa'ata'ita'iga lelei e aofia ai le fa'ailoga @ mo igoa ole Twitter po'o le $ mo tupe.

Pusa siaki ma leitio

E o'o atu i le v1.4, Bootstrap e mana'omia se fa'ailoga fa'aopoopo i pusa siaki ma leitio e fa'aputu ai. Ia, o se mataupu faigofie o le toe fai o le <label class="checkbox">mea e afifi ai le <input type="checkbox">.

E lagolagoina fo'i pusa siaki ma leitio. Na'o le fa'aopoopo .inlinei so'o se .checkboxpe .radioae mae'a.

Pepa i totonu ma fa'apipi'i/fa'aopoopo

Mo le fa'aogaina o mea e fa'apipi'i pe fa'apipi'i i totonu o se fomu fa'asinotonu, ia mautinoa e tu'u le .add-onma inputi luga ole laina tutusa, e aunoa ma ni avanoa.

Faatumu tusi fesoasoani

Mo le fa'aopoopoina o tusitusiga fesoasoani mo au mea e fa'aoga i totonu, fa'aaofia i totonu laina feso'ota'iga tusitusiga fa'atasi <span class="help-inline">po'o se poloka fa'amatalaga fesoasoani ma <p class="help-block">pe a mae'a le elemene fa'aoga.

Fa'amau mo gaioiga

I le avea ai o se fa'apotopotoga, e tatau ona fa'aoga fa'amau mo gaioiga a'o fa'aoga hyperlinks mo mea faitino. Mo se faʻataʻitaʻiga, "Download" e tatau ona avea ma faʻamau aʻo "gaoioiga lata mai" e tatau ona avea ma soʻotaga.

Mo taula ma fomu

E mafai ona fa'aoga sitaili fa'amau i so'o se mea e .btnfa'aoga. Ae ui i lea, e masani lava e te manaʻo e faʻaoga nei mea i na o <a>elemene <button>.

Manatua: O faamau uma e tatau ona aofia ai le .btnvasega. E tatau ona fa'aoga sitaili fa'amau <button>ma <a>elemene mo le fa'atasi.

Tele tetele

Mana'o i fa'amau tetele pe la'ititi? Fai i ai!

Gaioiga muamua Gaioiga

Gaioiga muamua Gaioiga

Tulaga le atoatoa

Mo fa'amau fa'aletonu, fa'aoga mo .btn-disabledso'oga ma elemene.:disabled<button>

Gaioiga muamua Gaioiga

Gaioiga muamua Gaioiga

Feso'ota'i su'esu'e

I le IE9, matou te tu'uina le fa'alili i luga o fa'amau uma e fiafia i tulimanu lapotopoto ona e le fa'aputuina e le IE9 fa'asologa o tua i tulimanu.

E feso'ota'i, IE9 fa'amanino buttonelemene fa'aletonu, fa'aefuefu tusitusiga ma se ata lafoia leaga-ae leaga e le mafai ona tatou fa'aleleia lenei mea.

Fausia e pei o se sprite

Nai lo le faia o fa'ailoga uma o se talosaga fa'aopoopo, ua matou tu'ufa'atasia i totonu o se sprite—o se vaega o ata i le faila e tasi e fa'aoga le CSS e fa'atulaga ai ata ma background-position. O le auala lava lea e tasi matou te faʻaogaina i luga o Twitter.com ma ua aoga lelei mo matou.

O vasega uma o ata o loʻo faʻapipiʻiina .icon-mo le vaʻaiga talafeagai ma le vaʻaia, e pei lava o isi vaega. O lenei mea o le a fesoasoani e aloese mai feteʻenaʻiga ma isi meafaigaluega.

Glyphicons ua tu'uina mai ia i matou le fa'aogaina o le Halflings seti i totonu o la matou mea faigaluega punaoa tatala pe afai matou te tuʻuina atu se fesoʻotaʻiga ma aitalafu iinei i le docs. Faamolemole mafaufau e fai le mea lava e tasi i au galuega faatino.

Fa'afefea ona fa'aoga

Faatasi ai ma le v2.0.0, ua matou filifili e faʻaoga se <i>pine mo a matou ata uma, ae leai se vasega faʻapitoa-naʻo se faʻailoga faʻasoa. Ina ia faʻaoga, tuʻu le faʻailoga lea e uiga i soʻo se mea:

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

E iai fo'i sitaili o lo'o avanoa mo ata fa'aliliu (pa'epa'e), ua saunia ma le isi vasega fa'aopoopo:

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

E 120 vasega e filifili mai ai mo au ata. Na'o le fa'aopoopoina o se <i>fa'ailoga ma vasega sa'o ma ua e setiina. E mafai ona e mauaina le lisi atoa i sprites.less po'o iinei i lenei pepa.

Fa'aoga mataupu

E lelei tele ata, ae o fea e faʻaaogaina e se tasi? O nai manatu nei:

• E fai ma ata mo lau fa'atautaiga i itu
• Mo se fa'ata'ita'iga fa'aigoa mama
• Mo fa'amau e fesoasoani e fa'ailoa ai le uiga o se gaioiga
• Fa'atasi ai ma feso'ota'iga e fa'asoa ai fa'amatalaga i le mea e alu i ai le tagata fa'aoga

O le mea moni, soʻo se mea e mafai ona e tuʻuina ai se <i>pine, e mafai ona e tuʻuina se faʻailoga.

Toe faafou Siaki atu Aveese

Faamatalaga Fa'atonu Fa'amatalaga atili