Dikarolo

Dikarolo tše dintši tšeo di ka dirišwago gape tšeo di agilwego bakeng sa go nea go sepela, ditemošo, di- popovers le tše dingwe.

Mehlala

Dikgetho tše pedi tša motheo, gotee le diphetogo tše dingwe tše pedi tše di lebanyago.

Sehlopha sa konopo e le nngwe

Phuthelela lelokelelo la dikonope ka .btnka .btn-group.

  1. <div sehlopha = "btn-sehlopha" >
  2. < sehlopha sa konopo = "btn" > Letsohong le letšehali </konopo>
  3. < sehlopha sa konopo = "btn" > Bohareng </konopo>
  4. < sehlopha sa konopo = "btn" > Tokelo ya </konopo>
  5. </div> e

Dihlopha tše dintši tša dikonope

Kopanya disete tsa <div class="btn-group">ka a <div class="btn-toolbar">bakeng sa dikarolo rarahaneng haholoanyane.

  1. <div sehlopha = "btn-bar ya didirišwa" >
  2. <div sehlopha = "btn-sehlopha" >
  3. ...
  4. </div> e
  5. </div> e

Dihlopha tša konope tše di emego thwii

Dira gore sete ya dikonope e bonagale e kgobokeditšwe ka go otlologa go e na le go rapalala.

  1. <div sehlopha = "btn-sehlopha btn-sehlopha-e emeng" >
  2. ...
  3. </div> e

Lepokisi la go hlahloba le ditatso tša radio

Dihlopha tša dikonope di ka šoma gape bjalo ka diradio, moo konope e tee fela e ka bago e šoma, goba mapokisi a go hlahloba, moo palo efe goba efe ya dikonope e ka bago e šoma. Lebelela ditokomane tša JavaScript bakeng sa seo.

Di-dropdown ka dihlopha tša konope

Dihlogo godimo!Dikonope tše di nago le dithepo di swanetše go phuthelwa ka botee ka .btn-groupgare ga a .btn-toolbarbakeng sa go fetolela gabotse.

Kakaretšo le mehlala

Šomiša konope efe goba efe go hlohleletša thepo ya go theoga ka go e bea ka gare ga a .btn-grouple go fa leswao la thepo ya maleba.

  1. <div sehlopha = "btn-sehlopha" >
  2. <a class = "btn dropdown-toggle" ya data-toggle = "go theoga" href = "#" >
  3. Kgato
  4. <span sehlopha = "caret" </span>
  5. </a>
  6. <ul sehlopha = "thepo ya go theoga" >
  7. <!-- dikgokagano tša thepo ya go theoga -->
  8. </ul>
  9. </div> e

E šoma ka bogolo ka moka bja dikonope

Dithepo tša dikonope di šoma ka bogolo bjo bofe goba bofe: .btn-large, .btn-small, goba .btn-mini.

E nyaka JavaScript

Dithepo tša konope di nyaka gore polaka ya go theoga ya Bootstrap e šome.

Maemong a mangwe—go swana le sellathekeng—dimenu tša go theoga di tla atologela ka ntle ga lefelo la go lebelela. O swanetše go rarolla go logaganya ka seatla goba ka JavaScript ya tlwaelo.


Arola konopo dropdowns

Go aga godimo ga mekgwa ya sehlopha sa konope le go swaya, re ka hlama konope ya go arogana gabonolo. Dikonope ta go aroganya di na le tiro ya maemo ka go la nngele le go fetola ga go theoga ka go le letona ka dikgokagano ta seemo.

  1. <div sehlopha = "btn-sehlopha" >
  2. < sehlopha sa konopo = "btn" > Tiro </konopo>
  3. < sehlopha sa konopo = "btn dropdown-toggle" ya data-toggle = "dropdown" >
  4. <span sehlopha = "caret" </span>
  5. </konope>
  6. <ul sehlopha = "thepo ya go theoga" >
  7. <!-- dikgokagano tša thepo ya go theoga -->
  8. </ul>
  9. </div> e

Bogolo

Diriša diklase tša konope tše di oketšegilego .btn-mini, .btn-small, goba .btn-largebakeng sa go lekanyetša bogolo.

  1. <div sehlopha = "btn-sehlopha" >
  2. < sehlopha sa konopo = "btn btn-mini" > Tiro </konopo>
  3. < sehlopha sa konopo = "btn btn-mini dropdown-toggle" ya data-toggle = "dropdown" >
  4. <span sehlopha = "caret" </span>
  5. </konope>
  6. <ul sehlopha = "thepo ya go theoga" >
  7. <!-- dikgokagano tša thepo ya go theoga -->
  8. </ul>
  9. </div> e

Dimenu tša go theoga

Dimenu tša go theoga le tšona di ka fetošwa go tšwa fase go ya godimo ka go oketša sehlopha se tee go motswadi wa kgauswi wa .dropdown-menu. E tla flip tlhahlo ya .caretle reposition menu ya ka boyona ho tloha tlase ho fihlela ho ena le holimo fatše.

  1. <div sehlopha = "btn-sehlopha dropup" >
  2. < sehlopha sa konopo = "btn" > Dropup </konopo>
  3. < sehlopha sa konopo = "btn dropdown-toggle" ya data-toggle = "dropdown" >
  4. <span sehlopha = "caret" </span>
  5. </konope>
  6. <ul sehlopha = "thepo ya go theoga" >
  7. <!-- dikgokagano tša thepo ya go theoga -->
  8. </ul>
  9. </div> e

Go beakanya matlakala ka maemo

Bonolo pagination bululetsoeng ke Rdio, e khōlō bakeng sa ditiriso tse dingwe le diphetho batla. Bloko e kgolo e thata go e foša, e ka lekanywa gabonolo, gomme e nea mafelo a magolo a go kgotla.

  1. <div sehlopha = "pagination" >
  2. <ul>
  3. <li><a href = "#" > Pele </a></li>
  4. <li><a href = "#" > 1 </a></li>
  5. <li><a href = "#" > 2 </a></li>
  6. <li><a href = "#" > 3 </a></li>
  7. <li><a href = "#" > 4 ​​</a></li>
  8. <li><a href = "#" > 5 </a></li>
  9. <li><a href = "#" > E latelago </a></li>
  10. </ul>
  11. </div> e

Dikgetho

Bogolofadi le mafolofolo e re

Links ba customizable bakeng sa maemo a fapaneng. Šomiša .disabledbakeng sa dikgokagano tšeo di sa kgotlego le .activego bontšha letlakala la bjale.

  1. <div sehlopha = "pagination" >
  2. <ul>
  3. <li sehlopha = "go golofetše" ><a href = "#" > « </a></li> e
  4. <li sehlopha = "mafolofolo" ><a href = "#" > 1 </a></li>
  5. ...
  6. </ul>
  7. </div> e

O ka fapantšha ka boikgethelo ditshetledi tše di šomago goba tše di golofetšego bakeng sa di-span go tloša mošomo wa go klika mola o boloka mekgwa yeo e reretšwego.

  1. <div sehlopha = "pagination" >
  2. <ul>
  3. <li sehlopha = "ba golofetšego" ><span> « </span></li> e
  4. <li sehlopha = "mafolofolo" ><span> 1 </span></li>
  5. ...
  6. </ul>
  7. </div> e

Bogolo

Fancy kgolo goba e nyenyane pagination? Oketša .pagination-large, .pagination-small, goba .pagination-minibakeng sa bogolo bjo bo oketšegilego.

  1. <div class = "matlakala a letlakala-kgolo" >
  2. <ul>
  3. ...
  4. </ul>
  5. </div> e
  6. <div sehlopha = "pagination" >
  7. <ul>
  8. ...
  9. </ul>
  10. </div> e
  11. <div sehlopha = "pagination maqephe-nyenyane" >
  12. <ul>
  13. ...
  14. </ul>
  15. </div> e
  16. <div sehlopha = "maqephe a matlakala-mini" >
  17. <ul>
  18. ...
  19. </ul>
  20. </div> e

Go logaganya

Oketša e nngwe ya diklase tše pedi tša boikhethelo go fetoša go logaganya ga dikgokagano tša matlakala: .pagination-centeredle .pagination-right.

  1. <div class = "go tsepama go letlakala la matlakala" >
  2. ...
  3. </div> e
  1. <div sehlopha = "pagination maqephe-tokelo" >
  2. ...
  3. </div> e

Pager ya go swana le yona

Dikgokagano tša ka pela tša peleng le tše di latelago bakeng sa diphethagatšo tše bonolo tša matlakala ka go swaya seetša le mekgwa. E botse kudu bakeng sa mafelo a bonolo a go swana le di-blog goba dimakasine.

Mohlala wa default

Ka default, pager e tsepamisa dikgokelo.

  1. <ul sehlopha = "pager" >
  2. <li><a href = "#" > E fetileng </a></li>
  3. <li><a href = "#" > E latelago </a></li>
  4. </ul>

Dikgokagano tše di logaganywago

Ka go fapana le moo, o ka logaganya kgokagano ye nngwe le ye nngwe go mahlakoreng:

  1. <ul sehlopha = "pager" >
  2. <li sehlopha = "pele" >
  3. <a href = "#" > & l rr; Ba bagolo </a>
  4. </li>
  5. <li sehlopha = "se latelang" >
  6. <a href = "#" > E ntjha → </a>
  7. </li>
  8. </ul>

Boemo bja go golofala bja boikgethelo

Dikgokagano tša Pager gape di šomiša .disabledsehlopha sa utility ya kakaretšo go tšwa go pagination.

  1. <ul sehlopha = "pager" >
  2. <li class = "pele e golofetše" >
  3. <a href = "#" > & l rr; Ba bagolo </a>
  4. </li>
  5. ...
  6. </ul>

Dileibole

Dileibole Go swaya
Hlokomologa <span class="label">Default</span>
Katlego <span class="label label-success">Success</span>
Temošo <span class="label label-warning">Warning</span>
Bohlokwa <span class="label label-important">Important</span>
Info <span class="label label-info">Info</span>
Inverse <span class="label label-inverse">Inverse</span>

Dipetšhe

Leina Mohlala Go swaya
Hlokomologa 1. 1. <span class="badge">1</span>
Katlego 2. <span class="badge badge-success">2</span>
Temošo 4. <span class="badge badge-warning">4</span>
Bohlokwa 6. <span class="badge badge-important">6</span>
Info 8. <span class="badge badge-info">8</span>
Inverse 10. <span class="badge badge-inverse">10</span>

E phuhlama gabonolo

Bakeng sa phethagatšo ye bonolo, dileibole le dipetšhe di tla no phuhlama (ka :emptymokgethi wa CSS) ge go se na diteng tšeo di lego gona ka gare.

Yuniti ya mogale

Karolo ye bobebe, ye e fetofetogago go bontšha diteng tša bohlokwa mo saeteng ya gago. E šoma gabotse go papatšo le mafelong ao a nago le diteng tše dintši.

Thobela, lefase!

Ye ke yuniti ye bonolo ya mogale, karolo ye bonolo ya mokgwa wa jumbotron ya go bitša tlhokomelo ye e oketšegilego go dikagare tše di bontšhitšwego goba tshedimošo.

Ithute ka botlalo

  1. <div sehlopha = "mohale-yuniti" >
  2. <h1> Hlogo ya </h1>
  3. <p> Mothaladi wa go swaya </p>
  4. <p>
  5. <a sehlopha = "btn btn-primary btn-kgolo" >
  6. Ithute ka botlalo
  7. </a>
  8. </p>
  9. </div> e

Hlogo ya letlakala

Kgapetla ye bonolo ya h1go sekgoba ka tshwanelo le go arola dikarolo ta diteng letlakaleng. E ka diriša h1's default small, elemente gammogo le bontši bja dikarolo tše dingwe (ka mekgwa ya tlaleletšo).

  1. <div sehlopha = "letlakala-hlooho" >
  2. <h1> Mohlala wa hlogo ya letlakala <small> Sengwalwa sa ka fasana sa hlogo </small></h1>
  3. </div> e

Ditshwantsho tse dinyenyane tsa kamehla

Ka go ikemela, diswantšho tše nnyane tša Bootstrap di hlamilwe go bontšha diswantšho tše di kgokagantšwego ka go swaya mo gonyenyane mo go nyakegago.

E ka fetošwa kudu

Ka go swaya go se nene ga tlaleletšo, go a kgonega go oketša mohuta ofe goba ofe wa diteng tša HTML go swana le dihlogo, dirapa, goba dikonope ka gare ga diswantšho tše nnyane.

  • 300x200 e le

    Leina la seswantšho se senyenyane

    Cras justo odio, dapibus ac facilisis ka, di-egestas di eget quam. Donec id elit e seng mi porta gravida ka eget metus. Nullam id dolor id nibh dikoloi tša dikoloi ut id elit.

    Kgato Kgato

  • 300x200 e le

    Leina la seswantšho se senyenyane

    Cras justo odio, dapibus ac facilisis ka, di-egestas di eget quam. Donec id elit e seng mi porta gravida ka eget metus. Nullam id dolor id nibh dikoloi tša dikoloi ut id elit.

    Kgato Kgato

  • 300x200 e le

    Leina la seswantšho se senyenyane

    Cras justo odio, dapibus ac facilisis ka, di-egestas di eget quam. Donec id elit e seng mi porta gravida ka eget metus. Nullam id dolor id nibh dikoloi tša dikoloi ut id elit.

    Kgato Kgato

Ke ka baka la’ng o diriša diswantšho tše dinyenyane

Diswantšho tše nnyane (tšeo pele di bego .media-griddi fihla go v1.4) di botse kudu bakeng sa digridi tša dinepe goba dibidio, dipoelo tša go nyaka diswantšho, ditšweletšwa tša mabenkele, dipotfolio, le tše dingwe tše dintši. Di ka ba dikgokagano goba dikagare tše di sa fetogego.

Go swaya mo go bonolo, mo go fetofetogago

Go swaya seswantšho se senyenyane go bonolo—a ulka palo le ge e le efe ya lidielemente ke sohle seo se nyakegago. Gape ke super flexible, e dumelela mohuta ofe goba ofe wa dikagare ka go swaya go se nene fela go phuthela dikagare tša gago.

E šomiša bogolo bja dikholomo tša keriti

Labofelo, karolo ya diswantšho tše nnyane e šomiša diklase tša tshepedišo ya keriti ye e lego gona—go swana le .span2goba .span3—bakeng sa taolo ya ditekanyo tša diswantšho tše nnyane.

Go swaya

Bjalo ka ge go boletšwe pejana, go swaya mo go nyakegago bakeng sa diswantšho tše dinyenyane go bobebe e bile go otlologile. Mona ke go lebelela peakanyo ya go se fetoge ya diswantšho tše di kgokagantšwego :

  1. <ul sehlopha = "diswantšho tše dinyenyane" >
  2. <li sehlopha = "span4" >
  3. <a href = "#" sehlopha = "seswantšho se senyenyane" >
  4. <img ya data-src = "moswari.js / 300x200" alt = "" >
  5. </a>
  6. </li>
  7. ...
  8. </ul>

Bakeng sa diteng tša HTML tša tlwaelo ka go diswantšho tše nnyane, go swaya go fetoga go se nene. Go dumelela diteng tša maemo a thibelo kae goba kae, re fapantšha the <a>ka go <div>rata bjalo:

  1. <ul sehlopha = "diswantšho tše dinyenyane" >
  2. <li sehlopha = "span4" >
  3. <div sehlopha = "seswantšho se senyenyane" >
  4. <img ya data-src = "moswari.js / 300x200" alt = "" >
  5. <h3> Leina la seswantšho se senyenyane </h3>
  6. <p> Tlhaloso ya seswantšho se senyenyane... </p>
  7. </div> e
  8. </li>
  9. ...
  10. </ul>

Mehlala e mengwe

Hlahloba dikgetho tša gago ka moka ka diklase tša go fapafapana tša keriti tšeo di lego gona go wena. O ka boela wa hlakanya le go nyalelanya bogolo bjo bo fapanego.

Temoso ya kamehla

Phuthelela sengwalwa sefe goba sefe le konope ya go raka ya boikhethelo ka gare .alertbakeng sa molaetša wa temošo ya temošo ya motheo.

Temošo! Best check yo self, ga o bonagale gabotse kudu.
  1. <div sehlopha = "temošo" >
  2. < mofuta wa konopo = "konopo" sehlopha = "tswalela" data-dismiss = "temošo" > × </konope>
  3. <strong> Temošo! </strong> Best check yo self, ga o bonagale gabotse kudu.
  4. </div> e

Raka dikonope

Mobile Safari le Mobile Opera diphensele, go tlaleletša go data-dismiss="alert"seka, di nyaka e href="#"bakeng sa go rakwa ga ditemošo ge o diriša <a>tag.

  1. <a href = "#" sehlopha = "tswalela" ya data-dismiss = "temošo" > &dinako; </a>

Ka go fapana le moo, o ka šomiša <button>elemente yeo e nago le seka sa datha, seo re kgethilego go se dira bakeng sa ditokomane tša rena. Ge o šomiša <button>, o swanetše go akaretša type="button"goba diforomo tša gago di ka se romele.

  1. < mofuta wa konopo = "konopo" sehlopha = "tswalela" data-dismiss = "temošo" > × </konope>

Lahla ditemošo ka JavaScript

Diriša ditemošo jQuery plugin bakeng sa go rakwa ka pela le bonolo ga ditemošo.


Dikgetho

Bakeng sa melaetša e metelele, oketša go tlatša ka godimo le ka tlase ga sephuthelwana sa temošo ka go oketša .alert-block.

Temošo!

Best check yo self, ga o bonagale gabotse kudu. Nulla vitae elit libero, e lego pharetra e lego augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

  1. <div sehlopha = "temošo temošo-thibelo" >
  2. < mofuta wa konopo = "konopo" sehlopha = "tswalela" data-dismiss = "temošo" > × </konope>
  3. <h4> Temošo! </h4>
  4. Best check yo self, ga o...
  5. </div> e

Dikgetho tše dingwe tša seemo

Oketša diklase tša boikhethelo go fetoša tlhalošo ya temošo.

Phošo goba kotsi

Ao snap! Fetoša dilo tše mmalwa godimo gomme o leke go romela gape.
  1. <div sehlopha = "temošo temošo-phošo" >
  2. ...
  3. </div> e

Katlego

O šomile gabotse! O bala molaetša wo o bohlokwa wa temošo ka katlego.
  1. <div sehlopha = "temošo temošo-katlego" >
  2. ...
  3. </div> e

Tshedimošo

Dihlogo godimo! Tlhokomedišo ye e nyaka tlhokomelo ya gago, eupša ga se ya bohlokwa kudu.
  1. <div sehlopha = "temošo temošo-tshedimošo" >
  2. ...
  3. </div> e

Mehlala le go swaya

Ya motheo

Default tsoelo-pele bareng le paatsepama gradient.

  1. <div sehlopha = "tšwelopele" >
  2. <div sehlopha = "bareng" setaele = " bophara : 60 %; " ></div>
  3. </div> e

E na le methalo

E šomiša gradient go hlola seabe sa methalo. Ga e hwetšagale go IE7-8.

  1. <div class = "tšwelopele ya tšwelopele-methalo" >
  2. <div sehlopha = "bareng" setaele = " bophara : 20 %; " ></div>
  3. </div> e

E di phelago

Oketša .activego .progress-stripedgo phediša methalo go le letona go ya go le letshadi. Ga e hwetšagale ka diphetolelong ka moka tša IE.

  1. <div class = "tšwelopele tšwelopele-striped mafolofolo" >
  2. <div sehlopha = "bareng" setaele = " bophara : 40 %; " ></div>
  3. </div> e

E kgobokeditšwe

Bea dibara tše ntši ka gare ga e tee .progressgo di kgoboketša.

  1. <div sehlopha = "tšwelopele" >
  2. <div sehlopha = "bareng bareng-katleho" setaele = " bophara : 35 %; " ></div>
  3. <div sehlopha = "bareng bareng-temošo" setaele = " bophara : 20 %; " ></div>
  4. <div sehlopha = "bareng bareng-kotsi" setaele = " bophara : 10 %; " ></div>
  5. </div> e

Dikgetho

Mebala ya tlaleletšo

Dibara tša tšwelopele di šomiša tše dingwe tša konope ye e swanago le diklase tša temošo bakeng sa mekgwa ye e sa fetogego.

  1. <div class = "tšwelopele ya tšwelopele-info" >
  2. <div sehlopha = "bareng" setaele = " bophara : 20 % " ></div>
  3. </div> e
  4. <div class = "tšwelopele tšwelopele-katlego" >
  5. <div sehlopha = "bareng" setaele = " bophara : 40 % " ></div>
  6. </div> e
  7. <div class = "tšwelopele ya tšwelopele-temošo" >
  8. <div sehlopha = "bareng" setaele = " bophara : 60 % " ></div>
  9. </div> e
  10. <div class = "tšwelopele ya tšwelopele-kotsi" >
  11. <div sehlopha = "bareng" setaele = " bophara : 80 % " ></div>
  12. </div> e

Dibara tša methalo

Go swana le mebala e tiilego, re na le dithipa tša tšwelopele tša methalo e fapa-fapanego.

  1. <div class = "tšwelopele ya tšwelopele-tshedimošo ya tšwelopele-striped" >
  2. <div sehlopha = "bareng" setaele = " bophara : 20 % " ></div>
  3. </div> e
  4. <div class = "tšwelopele tšwelopele-katlego tšwelopele-striped" >
  5. <div sehlopha = "bareng" setaele = " bophara : 40 % " ></div>
  6. </div> e
  7. <div class = "tšwelopele ya tšwelopele-temošo ya tšwelopele-striped" >
  8. <div sehlopha = "bareng" setaele = " bophara : 60 % " ></div>
  9. </div> e
  10. <div class = "tšwelopele ya tšwelopele-kotsi tšwelopele-methalo" >
  11. <div sehlopha = "bareng" setaele = " bophara : 80 % " ></div>
  12. </div> e

Thekgo ya sephephediši

Dibara tša tšwelopele di šomiša dikelo tša CSS3, diphetogo, le ditshwantšho tša go phela go fihlelela ditlamorago tša tšona ka moka. Dikarolo tše ga di thekgwe go IE7-9 goba diphetolelo tša kgale tša Firefox.

Diphetolelo tša peleng go feta Internet Explorer 10 le Opera 12 ga di thekge ditshwantšho tša go phela.

Mekgwa ya selo sa go se hlalošege sa go aga mehuta ye e fapanego ya dikarolo (go swana le ditshwayotshwayo tša blog, Di-Tweet, bj.bj.) tšeo di bontšhago seswantšho seo se logaganywago ka go le letshadi goba ka go le letona go bapa le diteng tša sengwalwa.

Mohlala wa default

Methopo ya ditaba ya go se fetoge e dumelela go phaphamala selo sa methopo ya ditaba (diswantšho, bidio, modumo) go ya ka go le letshadi goba ka go le letona la thibelo ya diteng.

64x64 e le

Hlogo ya boraditaba

Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate ya go ba le ditho tša mmele. Donec lacinia congue felis ka faucibus.
64x64 e le

Hlogo ya boraditaba

Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate ya go ba le ditho tša mmele. Donec lacinia congue felis ka faucibus.
64x64 e le

Hlogo ya boraditaba

Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate ya go ba le ditho tša mmele. Donec lacinia congue felis ka faucibus.
  1. <div sehlopha = "mecha ea litaba" >
  2. <a sehlopha = "hula-le letšehali" href = "#" >
  3. <img sehlopha = "media-ntho" ya data-src = "moswari.js / 64x64" >
  4. </a>
  5. <div sehlopha = "methopo-media" >
  6. <h4 class = "hlogo ya boraditaba" > Hlogo ya boraditaba </h4>
  7. ...
  8.  
  9. <!-- Selo sa boraditaba se se tsentšwego ka gare ga sehlaga -->
  10. <div sehlopha = "mecha ea litaba" >
  11. ...
  12. </div> e
  13. </div> e
  14. </div> e

Lenaneo la boraditaba

Ka go se nene ga go swaya mo go oketšegilego, o ka diriša methopo ya ditaba ka gare ga lenaneo (e nago le mohola bakeng sa ditlhale tša ditshwayotshwayo goba mananeo a dihlogo).

  • 64x64 e le

    Hlogo ya boraditaba

    Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis.

    64x64 e le

    Hlogo ya methopo ya ditaba ye e tsentšwego ka gare ga sehlaga

    Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis.
    64x64 e le

    Hlogo ya methopo ya ditaba ye e tsentšwego ka gare ga sehlaga

    Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis.
    64x64 e le

    Hlogo ya methopo ya ditaba ye e tsentšwego ka gare ga sehlaga

    Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis.
  • 64x64 e le

    Hlogo ya boraditaba

    Cras dula amet nibh libero, ka gravida nulla. Nulla vel metus scelerisque pele e le khomodo. Cras purus odio, vestibulum ka vulputate ka, tempus viverra turpis.
  1. <ul sehlopha = "lenane la mecha ea litaba" >
  2. <li sehlopha = "mecha ea litaba" >
  3. <a sehlopha = "hula-le letšehali" href = "#" >
  4. <img sehlopha = "media-ntho" ya data-src = "moswari.js / 64x64" >
  5. </a>
  6. <div sehlopha = "methopo-media" >
  7. <h4 class = "hlogo ya boraditaba" > Hlogo ya boraditaba </h4>
  8. ...
  9.  
  10. <!-- Selo sa boraditaba se se tsentšwego ka gare ga sehlaga -->
  11. <div sehlopha = "mecha ea litaba" >
  12. ...
  13. </div> e
  14. </div> e
  15. </li>
  16. </ul>

Didiba

Šomiša sediba bjalo ka khuetšo ye bonolo go elemente go e fa khuetšo ya go tsenya.

Bona, ke ka sedibeng!
  1. <div sehlopha = "hantle" >
  2. ...
  3. </div> e

Diklase tša boikgethelo

Taolo padding le dikhutlo potolohileng le tse peli boikhethelo mofetoledi dihlopha.

Bona, ke ka sedibeng!
  1. <div sehlopha = "hantle hantle-kgolo" >
  2. ...
  3. </div> e
Bona, ke ka sedibeng!
  1. <div sehlopha = "hantle hantle-nyenyane" >
  2. ...
  3. </div> e

Tswala letshwao

Šomiša leswao la go tswalela la kakaretšo bakeng sa go nyatša diteng go swana le di-modal le ditemošo.

  1. < sehlopha sa konopo = "tswalela" > × </konope>

Didirišwa tša iOS di nyaka href="#"ditiragalo tša go kgotla ge e ba o rata go diriša ankora.

  1. <a sehlopha = "tswalela" href = "#" > &nako; </a>

Diklase tša bathuši

Diklase tše bonolo, tše di tsepamego bakeng sa pontšho e nyenyane goba diphetogo tša boitshwaro.

.goga-ka go le letshadi

Phaphamala elemente e letšehali

  1. class = "goga-letsohong le letšehali".
  1. . hula - le letšehali { .
  2. float : ka go le letshadi ;
  3. } .

.goga-go le letona

Phaphamala elemente ka ho le letona

  1. sehlopha = "hula-tokelo".
  1. . goga - go le letona { .
  2. float : go le letona ;
  3. } .

.go kgaotše modumo

Fetoša mmala wa elemente go#999

  1. class = "e kgutsitsweng".
  1. . go kgaotša modumo { .
  2. mmala : # 999;
  3. } .

.hlakiša

Hlakola the floatka elements efe kapa efe

  1. class = "hlakiša".
  1. . hlakiša { .
  2. * zoom : 1 ;
  3. &: pele ga , .
  4. &: ka morago ga { .
  5. pontšho : tafola ;
  6. diteng : "" ;
  7. } .
  8. &: ka morago ga { .
  9. hlakile : bobedi ;
  10. } .
  11. } .