Fakkeenya

Jijjiiramaa, menu tarree tarreewwan hidhannoo agarsiisuuf. Ijaarsa JaavaScript kan gadi bu'aa ta'een walqunnamtii taasifame .

<ul class = "tarree-gadi-bu'aa" gahee = "menu" aria-labelledby = "Menu-gadi-bu'aa" >   
  <li><a tabindex = "-1" href = "#" > Tarkaanfii </a></li>  
  <li><a tabindex = "-1" href = "#" > Tarkaanfii biraa </a></li>  
  <li><a tabindex = "-1" href = "#" > Waan biraa asitti </a></li>  
  <li gita = "qoqqoodduu" </li> 
  <li><a tabindex = "-1" href = "#" > Hidhaa adda baafame </a></li>  
</ul> jechuun ni danda’ama

Markup gochuu

Sajoo tarree qofa yoo ilaalle, HTML barbaachisu kunooti. Qaaqa tarree fi sajoo tarree keessaa .dropdown, ykn qaama biraa kan labsu keessaa marsuu qabda position: relative;. Sana booda menu qofa uumuu.

<div class = "gadi bu'aa" > 
  <!-- Hidhaa ykn qaree toggle dropdown -->
  <ul gita = "sajoo-gadi-bu'aa" gahee = "sajoo" aria-labelledby = "dLabel" >   
    <li><a tabindex = "-1" href = "#" > Tarkaanfii </a></li>  
    <li><a tabindex = "-1" href = "#" > Tarkaanfii biraa </a></li>  
    <li><a tabindex = "-1" href = "#" > Waan biraa asitti </a></li>  
    <li gita = "qoqqoodduu" </li> 
    <li><a tabindex = "-1" href = "#" > Hidhaa adda baafame </a></li>  
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Filannoowwan

Menuuwwan gara mirgaatti qindeessii fi dabali sadarkaawwan dabalataa tarreewwan dabalata.

Menuuwwan qindeessuu

Sajoo tarree gara mirgaatti .pull-rightdabali ..dropdown-menu

<ul gita = "sajoo-gadi-bu'aa harkisaa-mirga" gahee = "sajoo" aria-labelledby = "dLabel" >   
  ...
</ul> jechuun ni danda’ama

Filannoowwan menu hanqifaman

Hidhaa hanqisuuf tarree keessaa atti .disableddabali .<li>

<ul class = "tarree-gadi-bu'aa" gahee = "menu" aria-labelledby = "Menu-gadi-bu'aa" >   
  <li><a tabindex = "-1" href = "#" > Hidhaa idilee </a></li>  
  <li class = "disabled" ><a tabindex = "-1" href = "#" > Hidhamni hanqifame </a></li>   
  <li><a tabindex = "-1" href = "#" > Hidhaa biraa </a></li>  
</ul> jechuun ni danda’ama

Menuuwwan xiqqaa kanneen gadi bu'an irratti

Sadarkaa dabalataa menuwwan gadi bu'aa dabali, akka kanneen OS X hover irratti mul'atu, dabalata mallattoo salphaa tokko tokkoo wajjin. Akkaataa ofumaan hojjechuuf sajoo tarree jiru keessatti .dropdown-submenukamiyyuutti dabali .li

<ul gita = "sajoo-gadi-bu'aa" gahee = "sajoo" aria-labelledby = "dLabel" >   
  ...
  <li class = "sajoo-xiqqaa-gadi-bu'aa" > 
    <a tabindex = "-1" href = "#" > Filannoo dabalataa </a>  
    <ul class = "tarree-gadi-bu'aa" > 
      ...
    </ul> jechuun ni danda’ama
  </li> jechuun ni danda’ama
</ul> jechuun ni danda’ama

Fakkeenyaaf

Filannoowwan bu'uuraa lama, garaagarummaa addaa lama dabalataa wajjin.

Garee button tokko

Qabduulee walduraa duubaan jiran .btnin tiin marsi .btn-group.

<div gita = "btn-garee" > 
  <button class = "btn" > Bitaa </button> 
  <button class = "btn" > Giddugaleessa </button> 
  <button class = "btn" > Mirgaa </button> 
</div> jechuun ni danda’ama

Gareewwan buttooni hedduu

Tuutawwan of <div class="btn-group">gara <div class="btn-toolbar">atti qaamolee walxaxaa ta'aniif walitti makuu.

<div class = "btn-barruu meeshaa" > 
  <div gita = "btn-garee" > 
    ...
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Gareewwan buttooni dhaabbataa

Tuuta qaree akka qajeelaa osoo hin taane dhaabbataadhaan tuulame akka mul'atu godhi.

<div class = "btn-garee btn-garee-dhaabbataa" > 
  ...
</div> jechuun ni danda’ama

Sanduuqa filannoo fi mi'aawwan raadiyoo

Gareen qaree akka raadiyoottis hojjechuu danda'u, bakka qaree tokko qofti socho'uu danda'u, ykn sanduuqawwan filannoo, bakka qaree lakkoofsi kamiyyuu socho'uu danda'u. Sanaaf galmeewwan JaavaScript ilaali .

Garee qaree keessatti gadi bu'aa

Mataa ol qaba!Qabduulee gadi bu'oo qaban dhuunfaan kan isaanii .btn-groupkeessatti a keessaa marfamuu qabu .btn-toolbarsirriitti agarsiisuuf.

Haala waliigalaa fi fakkeenya

Qabduu kamiyyuu fayyadamii a keessa kaa'uu .btn-groupfi mallattoo menu sirrii ta'e kennuudhaan sajoo tarree kakaasuuf.

<div gita = "btn-garee" > 
  <a class = "btn gadi-bu'aa-jijjiirraa" deetaa-jijjiirraa = "gara-bu'aa" href = "#" >   
    Gocha
    <span gita = "kareettii" </span> 
  </a> jechuun ni danda’ama
  <ul class = "tarree-gadi-bu'aa" > 
    <!-- hidhamtoota menu gadi bu'aa -->
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Safara buttooni hunda waliin hojjeta

Tarreewwan qaree hammangaa kamiinuu hojjetu: .btn-large, .btn-small, ykn .btn-mini.

JaavaScript barbaada

Tarreewwan qaree akka hojjetuuf ifteessaan tarree Bootstrap barbaadu .

Haala tokko tokko keessatti—akkuma mobaayilaa—menuuwwan gadi bu'an balbala ilaalchaatiin ala ni babal'atu. Hiriirsa harkaan ykn JaavaScript amalaatiin furuu qabda.

Tarreewwan qaree addaan qoodi

Akkaataa garee qaree fi mallattoo irratti ijaaruun, salphaatti qaree qoqqoodinsaa uumuu dandeenya. Qabduulee qoqqoodinsaa gocha istaandaardii bitaa fi jijjiirraa gadi bu'aa mirga irratti hidhannoowwan haalata waliin agarsiisu.

<div gita = "btn-garee" > 
  <button class = "btn" > Tarkaanfii </button> 
  <button class = "btn gadi bu'aa-jijjiirraa" deetaa-jijjiirraa = "gara bu'aa" >  
    <span gita = "kareettii" </span> 
  </button> jedhu
  <ul class = "tarree-gadi-bu'aa" > 
    <!-- hidhamtoota menu gadi bu'aa -->
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Saayiziiwwan

Gitoota qaree dabalataa .btn-mini, .btn-small, ykn .btn-largesafaraaf fayyadami.

<div gita = "btn-garee" > 
  <button class = "btn btn-mini" > Tarkaanfii </button> 
  <button class = "btn btn-mini gadi-bu'aa-jijjiirraa" deetaa-jijjiirraa = "gadi-bu'aa" >  
    <span gita = "kareettii" </span> 
  </button> jedhu
  <ul class = "tarree-gadi-bu'aa" > 
    <!-- hidhamtoota menu gadi bu'aa -->
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Menuuwwan gadi bu'an

Akkasumas, sajoo gadi bu'aa gita tokko gara warra battalumatti dabaluudhaan jalaa gara oliitti jijjiiruun ni danda'ama .dropdown-menu. Kallattii kan garagalchee .caretfi menu ofii isaa irra deebi'ee bakka gubbaa gadi osoo hin taane jalaa gara oliitti socho'a.

<div class = "btn-garee gadi bu'uu" > 
  <button class = "btn" > Gadi bu'uu </button> 
  <button class = "btn gadi bu'aa-jijjiirraa" deetaa-jijjiirraa = "gara bu'aa" >  
    <span gita = "kareettii" </span> 
  </button> jedhu
  <ul class = "tarree-gadi-bu'aa" > 
    <!-- hidhamtoota menu gadi bu'aa -->
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Durtii salphaa Mallattoo walfakkaataa, gita adda addaa

Qaamonni nav hundi asitti—caancala, kiniinii, fi tarreewwan— mallattoo bu'uuraa fi akkaataa walfakkaataa karaa .navgitaa qooddatu.

Caancaloota bu'uuraa

Links regular fudhadhaatii <ul>itti dabalaa .nav-tabs:

<ul gita = "nav nav-tabs" > 
  <li gita = "socho'aa" > 
    <a href = "#" > Mana </a> 
  </li> jechuun ni danda’ama
  < li ><a href = "#" > ... Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
  < li ><a href = "#" > ... Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
</ul> jechuun ni danda’ama

Kiniinii bu'uuraa

HTML walfakkaataa sana fudhadhu, garuu .nav-pillsbakka isaa fayyadami:

<ul class = "nav nav-kiniinii" > 
  <li gita = "socho'aa" > 
    <a href = "#" > Mana </a> 
  </li> jechuun ni danda’ama
  < li ><a href = "#" > ... Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
  < li ><a href = "#" > ... Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
</ul> jechuun ni danda’ama

Haala hanqifame

Qaama nav kamiifuu (caancala, kiniinii, ykn tarree), hidhannoo halluu diimaa fi bu'aa hover hin.disabled qabneef dabali . Hidhamtoonni cuqaafamuu danda'anii ni hafu, haa ta'u malee, yoo amallicha haqxe malee . Akka filannootti, cuqaasawwan sana ittisuuf JaavaScript amala hojiirra oolchuu dandeessa.href

<ul class = "nav nav-kiniinii" > 
  ...
  <li class = "qaama miidhame" ><a href = "#" > Mana </a></li>  
  ...
</ul> jechuun ni danda’ama

Hiriirsa qaamolee

Hidhamtoota nav qindeessuuf, gitaalee .pull-leftykn faayidaa fayyadami. .pull-rightGitoonni lamaan kallattii ifteessame irratti CSS float ni dabalu.

Tuulamaa kan danda'u

Akkuma caancalaa fi kiniinii durtiidhaan qajeelaa ta'an, gita lammaffaa qofa dabali, .nav-stacked, akka isaan dhaabbataadhaan tuulaman akka mul'atan gochuuf.

Caancaloota walitti tuulaman

<ul class = "nav nav-tabs nav-tuulame" > 
  ...
</ul> jechuun ni danda’ama

Kiniinii walitti tuulame

<ul class = "nav nav-kiniinii nav-tuulame" > 
  ...
</ul> jechuun ni danda’ama

Dropdowns kan jedhu

Sajoo tarree HTML xiqqoo dabalataa fi tarreewwan JavaScript plugin waliin dabali .

Caancaloota kanneen gadi bu'an qaban

<ul gita = "nav nav-tabs" > 
  <li class = "gadi bu'aa" > 
    <a class = "gadi-bu'aa-jijjiirraa". 
       data-toggle = "gadi bu'aa".
       href = "#" > jedhu
        Gadi bu'aa
        <b gita = "kaartaa" ></b> 
      </a> jechuun ni danda’ama
    <ul class = "tarree-gadi-bu'aa" > 
      <!-- walitti hidhamiinsa -->
    </ul> jechuun ni danda’ama
  </li> jechuun ni danda’ama
</ul> jechuun ni danda’ama

Kiniinii kan dropdown qabu

<ul class = "nav nav-kiniinii" > 
  <li class = "gadi bu'aa" > 
    <a class = "gadi-bu'aa-jijjiirraa". 
       data-toggle = "gadi bu'aa".
       href = "#" > jedhu
        Gadi bu'aa
        <b gita = "kaartaa" ></b> 
      </a> jechuun ni danda’ama
    <ul class = "tarree-gadi-bu'aa" > 
      <!-- walitti hidhamiinsa -->
    </ul> jechuun ni danda’ama
  </li> jechuun ni danda’ama
</ul> jechuun ni danda’ama

Tarreewwan Nav

Karaa salphaa fi salphaa gareewwan walitti hidhamiinsa nav mataduree filannoo waliin ijaaruuf. Isaanis sidebars akka Finder OS X keessatti fayyadamuun gaarii dha.

Fakkeenya tarree nav

Tarree hidhannoo fudhadhaatii itti dabalaa class="nav nav-list":

<ul gita = "tarree-nav nav" > 
  <li class = "nav-header" > Mataduree tarree </li> 
  <li class = "socho'aa" ><a href = "#" > Mana </a></li>  
  <li><a href = "#" > Mana kitaabaa </a></li> 
  ...
</ul> jechuun ni danda’ama

YaadannooTarree nav keessaa man'eedhaaf, class="nav nav-list"man'ee kamiyyuu irratti dabali <ul>.

Qoqqoodduu horizontaalaa

Qabduu tarree duwwaa gita waliin uumuun qooda qajeelaa dabali .divider, akkas:

<ul gita = "tarree-nav nav" > 
  ...
  <li gita = "qoqqoodduu" </li> 
  ...
</ul> jechuun ni danda’ama

Tabbataa nav

Qabiyyee gidduutti karaa caancalaa jijjiiruuf ifteessituu salphaa ta'een caancalaa kee jireenyatti fidi. Bootstrap caancala caancala akkaataa afuriin walitti fida: gubbaa (durtii), mirga, jalaa, fi bitaa.

Fakkeenya gabatee

.tab-paneCaancalawwan caancala akka ta'an gochuuf, caancala hundaaf ID addaa qabu uumuun .tab-content.

Kutaa 1ffaa keessa jira.

Howdy, ani kutaa 2ffaa keessa jira.

What up girl, kun Kutaa 3ffaadha.

<div class = "tabbable" > <!-- Caancala bitaa/mirgaa qofaaf barbaachisa -->  
  <ul gita = "nav nav-tabs" > 
    <li class = "socho'aa" ><a href = "#tab1" data-toggle = "caancala" > Kutaa 1 </a></li>   
    <li><a href = "#tab2" data-toggle = "caancala" > Kutaa 2ffaa </a></li>  
  </ul> jechuun ni danda’ama
  <div class = "qabiyyee-caancala" > 
    <div class = "caancala-qaree socho'aa" id = "caancala1" >  
      <p> Kutaa 1ffaa keessa jira. </p>
    </div> jechuun ni danda’ama
    <div class = "caancala-qaaqa" id = "caancala2" >  
      <p> Howdy, ani kutaa 2ffaa keessa jira. </p>
    </div> jechuun ni danda’ama
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Caancala keessatti fade

Caancaloota akka keessaa bahan gochuuf, .fadetokkoon tokkoon .tab-pane.

Ijaarsa jQuery barbaada

Caancaloota gabatee qaban hundinuu kan humna argatan jQuery plugin keenya salphaadha. Waa'ee akkaataa caancalaa caancalaa jireenyatti fiduu fuula galmeewwan JaavaScript irratti bal'inaan dubbisi .

Kallattii kamiinuu tabbachuu danda'a

Caancaloota jala jiran

Tartiiba HTML garagalchiiti gita itti dabali caancalaa jala kaa'uuf.

Kutaa A keessa jira.

Howdy, ani kutaa B keessa jira.

What up girl, kun Kutaa C dha.

<div class = "caancalawwan caancala-armaan gadii" > 
  <div class = "qabiyyee-caancala" > 
    ...
  </div> jechuun ni danda’ama
  <ul gita = "nav nav-tabs" > 
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Caancala bitaa irratti argamu

Caancala bitaa irratti kaa'uuf gita jijjiiri.

Kutaa A keessa jira.

Howdy, ani kutaa B keessa jira.

What up girl, kun Kutaa C dha.

<div class = "caancalawwan caancala-bitaa" > 
  <ul gita = "nav nav-tabs" > 
    ...
  </ul> jechuun ni danda’ama
  <div class = "qabiyyee-caancala" > 
    ...
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Caancalawwan gara mirgaa jiran

Caancala gara mirgaa kaa'uuf gita jijjiiri.

Kutaa A keessa jira.

Howdy, ani kutaa B keessa jira.

What up girl, kun Kutaa C dha.

<div class = "caancalawwan caancala-mirga" > 
  <ul gita = "nav nav-tabs" > 
    ...
  </ul> jechuun ni danda’ama
  <div class = "qabiyyee-caancala" > 
    ...
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Navbar bu'uuraa

Jalqabuuf, navbars static dha (gubbaatti hin dhaabbatan) fi deeggarsa maqaa piroojektii fi navigeeshinii bu'uuraa of keessatti qabatu. Tokko bakka kamiyyuu a keessa kaa'i .container, kunis bal'ina marsariitii fi qabiyyee kee saaga.

<div gita = "navbar" > 
  <div class = "navbar-keessaa" > 
    <a class = "brand" href = "#" > Mata duree </a>  
    <ul gita = "nav" > 
      <li class = "socho'aa" ><a href = "#" > Mana </a></li>  
      <li><a href = "#" > Hidhaa </a></li> 
      <li><a href = "#" > Hidhaa </a></li> 
    </ul> jechuun ni danda’ama
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Qaamolee Navbar

Maqaa oomishaa

Link salphaa maqaa maqaa ykn pirojektii kee agarsiisuuf anchor tag qofa barbaada.

<a class = "brand" href = "#" > Maqaa pirojektii </a>

Nav hidhaa

Wantoonni Nav karaa tarreewwan hin tartiibamin dabaluudhaaf salphaadha.

<ul gita = "nav" > 
  <li gita = "socho'aa" > 
    <a href = "#" > Mana </a> 
  </li> jechuun ni danda’ama
  <li><a href = "#" > Hidhaa </a></li> 
  <li><a href = "#" > Hidhaa </a></li> 
</ul> jechuun ni danda’ama

Wanti tarree duwwaa fi gita salphaa ta'een salphaatti hiriyoota nav kee irratti qooddattoota dabaluu dandeessa. Kana hidhaa gidduutti dabaluu qofa:

<ul gita = "nav" > 
  ...
  <li class = "qoqqoodduu-dhaabbataa" </li> 
  ...
</ul> jechuun ni danda’ama

Unkaalee

Unkaa navbar keessaa sirritti akkaataa fi kaa'uuf, gitawwan barbaachisoo akka armaan gadiitti dabali. Unka durtiidhaaf, hammachuu .navbar-formfi yookaan yookaan .pull-leftsirriitti .pull-rightqindeessuuf.

< gita unkaa = "navbar-unkaa harkisaa-bitaa" > 
  < gosa galtee = "barruu" gita = "span2" >  
  <button type = "galchi" class = "btn" > Galchi </button>  
</form> jedhu

Unka barbaadi

Unka barbaacha caalaatti dhuunfatameef, galtee akkaataa addaa navbar keessatti fi .navbar-searchirratti dabali.form.search-query

<form class = "navbar-barbaacha harkisaa-bitaa" > 
  < gosa galtee = "barruu" gita = "barbaadi-gaaffii" iddooqa = "Barbaadi" >   
</form> jedhu

Hiriirsa qaamolee

Hidhamtoota nav, unka barbaadi, ykn barruu qindeessii, gitaalee .pull-leftykn faayidaa fayyadami. .pull-rightGitoonni lamaan kallattii ifteessame irratti CSS float ni dabalu.

Gadi bu'oota fayyadamuu

Xiqqoo mallattoo fi tarreewwan JavaScript plugin waliin gara nav tti tarreewwanii fi gadi bu'iinsa dabali .

<ul gita = "nav" > 
  <li class = "gadi bu'aa" > 
    <a href = "#" class = "gadi-bu'aa-jijjiirraa" deetaa-jijjiirraa = "gadi-bu'aa" >   
      Herrega
      <b gita = "kaartaa" ></b> 
    </a> jechuun ni danda’ama
    <ul class = "tarree-gadi-bu'aa" > 
      ...
    </ul> jechuun ni danda’ama
  </li> jechuun ni danda’ama
</ul> jechuun ni danda’ama

Mallattoo dabalataa fi odeeffannoo tarreewwan waamichaa argachuuf galmee tarreewwan JaavaScript daawwadhu .

Barreeffama

Tarreewwan barruu qaama keessatti .navbar-text, yeroo baay'ee <p>mallattoo irratti dursaa fi halluu sirrii ta'eef marsi.

Jijjiirama agarsiisa filannoo

Navbar gara gubbaa ykn jala mul'ataa gita dabalataa div isa alaa irratti sirreessii, .navbar.

Gubbaa irratti dhaabbataa ta'e

Dabaluu .navbar-fixed-topfi naannoo dhokataa isa jala jiruuf yoo xiqqaate 40px paddinggara <body>. Kana booda Bootstrap CSS hundee booda fi CSS deebii filannoo dura dabaluu kee mirkaneessi.

<div class = "navbar navbar-gubbaa-dhaabbataa" > 
  ...
</div> jechuun ni danda’ama

Gara jalaatti sirreeffame

Bakka isaa itti dabali .navbar-fixed-bottom.

<div class = "navbar navbar-dhaabbataa-gadi" > 
  ...
</div> jechuun ni danda’ama

Navbar gubbaa istaatiksii

Navbar bal'ina guutuu kan fuula waliin deemu dabaluudhaan uumi .navbar-static-top. Daree irraa adda ta'ee .navbar-fixed-top, padding kamiyyuu irratti jijjiiruun si hin barbaachisu body.

<div class = "navbar navbar-gubbaa-istaatiksii" > 
  ...
</div> jechuun ni danda’ama

Navbar deebii kan kennu

Navbar deebii kennu kufaa jiru hojiirra oolchuuf, qabiyyee navbar kee div of keessaa qabu keessatti marsi, .nav-collapse.collapse, fi qaree jijjiirraa navbar itti dabali, .btn-navbar.

<div gita = "navbar" > 
  <div class = "navbar-keessaa" > 
    <div class = "qabduu" > 
 
      <!-- .btn-navbar akka jijjiirraa qabiyyee navbar kufeef fayyadama -->
      <a class = "btn btn-navbar" deetaa-jijjiirraa = "kufaatii" deetaa-galma = ".nav-kufaatii" >   
        <span class = "mallattoo-barruu" </span> 
        <span class = "mallattoo-barruu" </span> 
        <span class = "mallattoo-barruu" </span> 
      </a> jechuun ni danda’ama
 
      <!-- Yoo akka agarsiifamu barbaadde maqaa sana achi keessaa dhiisuu kee mirkaneessi -->
      <a class = "brand" href = "#" > Maqaa pirojektii </a>  
 
      <!-- Wanti barbaaddu hunda 940px fi isaa gadi dhoksuu, as keessa kaa'i -->
      <div class = "nav-kufaatii kufaatii" > 
        <!-- .nav, .navbar-barbaacha, .navbar-unkaa fi kkf -->
      </div> jechuun ni danda’ama
 
    </div> jechuun ni danda’ama
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Mataa ol qaba! Navbar deebii kennu plugin kufaatii fi faayilii Bootstrap CSS deebii kennuu barbaada .

Jijjiirama garagalfame

Ilaalcha navbar dabaluudhaan fooyyessi .navbar-inverse.

<div class = "navbar navbar-faallaa" > 
  ...
</div> jechuun ni danda’ama

Fakkeenyaaf

Fakkeenyi tokko akka fuula hedduu irratti agarsiifamuu danda'utti agarsiifame.

<ul class = "daabboo" > 
  <li><a href = "#" > Mana </a> <span class = "qoqqoodduu" > / </span></li>   
  <li><a href = "#" > Mana kitaabaa </a> <span class = "qoqqoodduu" > / </span></li>   
  <li class = "socho'aa" > Deetaa </li> 
</ul> jechuun ni danda’ama

Fuula istaandaardii

Pagenation salphaa Rdio irraa kaka'umsa argate, apps fi bu'aa barbaachaaf gaarii dha. Blookiin guddaan darbuun rakkisaadha, salphaatti kan guddatu, fi naannoo cuqaasuu gurguddoo kenna.

<div class = "fuula" > 
  <ul> jedhamuun beekama
    <li><a href = "#" > Duraa </a></li> 
    < li ><a href = "#" > 1 Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
    < li ><a href = "#" > 2 Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
    < li ><a href = "#" > 3 Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
    < li ><a href = "#" > 4 Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
    < li ><a href = "#" > 5 Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo 
    <li><a href = "#" > Itti aanu </a></li> 
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Filannoowwan

Haalata hanqifamee fi socho'aa

Hidhamtoonni haala adda addaatiif haala barbaadamuun kan jijjiiramudha. .disabledHidhamtoota hin cuqaasuu fi .activefuula ammaa agarsiisuuf fayyadami .

<div class = "fuula" > 
  <ul> jedhamuun beekama
    <li class = "kan hin hojjenne" ><a href = "#" > « </a></li> jedhu  
    <li gita = "socho'aa" ><a href = "#" > 1 </a></li>  
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Akkaataa yaadame osoo qabduu dalagaa cuqaasuu haquuf filannoodhaan anchors socho'aa ykn hanqifame spans'f jijjiiruu dandeessa.

<div class = "fuula" > 
  <ul> jedhamuun beekama
    <li class = "qaama miidhame" ><span> « </span></li> jedhamuun beekama 
    <li gita = "socho'aa" ><span> 1 </span></li> 
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Saayiziiwwan

Fuula guddaa moo xiqqaa ta'e barbaadduu? .pagination-large, .pagination-small, ykn .pagination-minihammangaa dabalataaf dabali .

<div class = "fuula fuula-guddaa" > 
  <ul> jedhamuun beekama
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama
<div class = "fuula" > 
  <ul> jedhamuun beekama
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama
<div class = "fuula fuula-xiqqaa" > 
  <ul> jedhamuun beekama
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama
<div class = "fuula fuula-mini" > 
  <ul> jedhamuun beekama
    ...
  </ul> jechuun ni danda’ama
</div> jechuun ni danda’ama

Hiriirsuu

Hiriirsa hidhannoo fuula jijjiiruuf gita filannoo lama keessaa tokko dabali: .pagination-centeredfi .pagination-right.

<div class = "fuula fuula giddugaleessa godhate" > 
  ...
</div> jechuun ni danda’ama

<div class = "fuula fuula-mirga" > 
  ...
</div> jechuun ni danda’ama

Pager jedhamuun beekama

Hidhamtoota saffisaa duraa fi itti aanan hojiirra oolmaa fuula salphaa mallattoo ifaa fi akkaataa waliin. Marsariitiiwwan salphaa akka biloogii ykn barruuleedhaaf baayyee gaarii dha.

Fakkeenya durtii

Akka durtiitti, peejiiriin hidhannoowwan giddugaleessa godha.

<ul gita = "pager" > 
  <li><a href = "#" > Duraa </a></li> 
  <li><a href = "#" > Itti aanu </a></li> 
</ul> jechuun ni danda’ama

Hidhamtoota qindaa'an

Akka filannootti, tokkoon tokkoon hidhaa gara cinaachaatti qindeessuu dandeessa:

<ul gita = "pager" > 
  <li class = "duraa" > 
    <a href = "#" > Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo; Dullooman </a> 
  </li> jechuun ni danda’ama
  <li class = "itti aanu" > 
    <a href = "#" > Haaraa → </a> jechuun ni danda’ama 
  </li> jechuun ni danda’ama
</ul> jechuun ni danda’ama

Haalata hanqifame filannoo

Hidhamtoonni fuulaa akkasumas .disabledgita faayidaa waliigalaa fuula irraa fayyadamu.

<ul gita = "pager" > 
  <li class = "duraan hanqifame" > 
    <a href = "#" > Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo; Dullooman </a> 
  </li> jechuun ni danda’ama
  ...
</ul> jechuun ni danda’ama

Asxaalee

Asxaalee	Markup gochuu
Durtii dha	`<span class="label">Default</span>`
Milkaa'ina	`<span class="label label-success">Success</span>`
Akeekkachiisa	`<span class="label label-warning">Warning</span>`
Barbaachisaa	`<span class="label label-important">Important</span>`
Info	`<span class="label label-info">Info</span>`
Faallaa	`<span class="label label-inverse">Inverse</span>`

Baajiiwwan

Maqaa	Fakkeenya	Markup gochuu
Durtii dha	1. 1.	`<span class="badge">1</span>`
Milkaa'ina	2. 2.	`<span class="badge badge-success">2</span>`
Akeekkachiisa	4. 4.	`<span class="badge badge-warning">4</span>`
Barbaachisaa	6. 6.	`<span class="badge badge-important">6</span>`
Info	8.	`<span class="badge badge-info">8</span>`
Faallaa	10.	`<span class="badge badge-inverse">10</span>`

Salphaatti kan kufamu

Hojiirra oolmaa salphaadhaaf, asxaaleen fi baajiiwwan salphaatti ni kufa (karaa :emptyfilannoo CSS) yeroo qabiyyeen tokkollee keessa hin jirre.

Goota kutaa

Qabiyyee ijoo marsariitii kee irratti agarsiisuuf qaama salphaa, jijjiiramaa. Marsariitiiwwan gabaa fi qabiyyee baay’atan irratti akka gaariitti hojjeta.

Akkam jirtu addunyaa!

Kun yuunitii goota salphaadha, qabiyyee ykn odeeffannoo mul'ateef xiyyeeffannoo dabalataa waamuuf qaama salphaa akkaataa jumbotron-style dha.

Caalaatti baradhaa

<div class = "kutaa-goota" > 
  <h1> Mata duree </h1>
  <p> Sarara mallattoo </p>
  <p> jedhu
    <a gita = "btn btn-duraa duubaa btn-guddaa" > 
      Caalaatti baradhaa
    </a> jechuun ni danda’ama
  </p> jechuun ni danda’ama
</div> jechuun ni danda’ama

Mata duree fuula

Qaaqa salphaa h1kutaa qabiyyee fuula tokko irratti haala sirrii ta'een addaan baasuu fi qooduuf. Inni h1's durtii small, elementii akkasumas irra caalaan qaamolee biroo (akkaataa dabalataa wajjin) fayyadamuu danda'a.

<div class = "mata duree-fuula" > 
  <h1> Fakkeenya mataduree fuula <xiqqaa> Barruu xiqqaa mataduree </small></h1>
</div> jechuun ni danda’ama

Fakkiiwwan xiqqaa durtii

Akka durtiitti, fakkiiwwan xiqqaa Bootstrap fakkiiwwan walqabsiisan mallattoo xiqqaa barbaachisuun agarsiisuuf qophaa'aniiru.

Baay'ee kan ofii barbaade

Xiqqoo mallattoo dabalataatiin, qabiyyee HTML gosa kamiyyuu kan akka mata duree, keewwata, ykn qaree gara suuraa xiqqaatti dabaluun ni danda'ama.

Asxaa suuraa xiqqaa

Cras justo odio, dapibus ac facilisis keessatti, egestas eget quam jedhamuun beekama. Donec id elit non mi porta gravida yeroo eget metus jedhamutti. Nullam id dolor id nibh ultricies konkolaataa ut id elit.

Gocha Gocha
Asxaa suuraa xiqqaa

Cras justo odio, dapibus ac facilisis keessatti, egestas eget quam jedhamuun beekama. Donec id elit non mi porta gravida yeroo eget metus jedhamutti. Nullam id dolor id nibh ultricies konkolaataa ut id elit.

Gocha Gocha
Asxaa suuraa xiqqaa

Cras justo odio, dapibus ac facilisis keessatti, egestas eget quam jedhamuun beekama. Donec id elit non mi porta gravida yeroo eget metus jedhamutti. Nullam id dolor id nibh ultricies konkolaataa ut id elit.

Gocha Gocha

Maaliif suuraa xiqqaa fayyadamna

Suuraaleen xiqqaan (duraan .media-gridhanga v1.4tti) giiridii suuraa ykn viidiyoo, bu'aa barbaacha suuraa, oomishaalee daldalaa, portfolio, fi kkf baay'ee gaarii dha. Isaanis hidhaa ykn qabiyyee static ta’uu danda’u.

Mallattoo salphaa, jijjiiramaa

Mallattoon suuraa xiqqaa salphaadha-a ullakkoofsa lielementoota kamiyyuu waliin waan barbaachisu qofa. Akkasumas super flexible dha, qabiyyee kee marsuuf gosa qabiyyee kamiyyuu mallattoo xiqqoo dabalataa qofaan hayyama.

Hammangaawwan tarjaa tarjaa fayyadama

Dhumarratti, qaamni suuraa xiqqaa gita sirna tarjaa jiran fayyadama—akka .span2ykn .span3—to'annoo dimenshinii suuraa xiqqaadhaaf.

Markup gochuu

Akkuma kanaan dura jedhame, mallattoo xiqqaadhaaf barbaachisu salphaa fi qajeelaa dha. Fakkiiwwan walqabsiifamaniif qindeessaa durtii kunooti :

<ul class = "fakkiiwwan xiqqaa" > 
  <li gita = "span4" > 
    <a href = "#" class = "fakkii xiqqaa" >  
      <img deetaa-src = "qabaa.js/300x200" alt = "" >  
    </a> jechuun ni danda’ama
  </li> jechuun ni danda’ama
  ...
</ul> jechuun ni danda’ama

Qabiyyee HTML amala suuraa xiqqaa keessatti, mallattoon xiqqoo jijjiirama. <a>Qabiyyee sadarkaa ugguraa bakka kamittiyyuu hayyamuuf, kan <div>akka akkasitti jijjiirra :

<ul class = "fakkiiwwan xiqqaa" > 
  <li gita = "span4" > 
    <div class = "fakkii xiqqaa" > 
      <img deetaa-src = "qabaa.js/300x200" alt = "" >  
      <h3> Asxaa suuraa xiqqaa </h3>
      <p> Barreeffama xiqqaa... </p>
    </div> jechuun ni danda’ama
  </li> jechuun ni danda’ama
  ...
</ul> jechuun ni danda’ama

Fakkeenya dabalataa

Filannoowwan kee hunda gita tarjaa adda addaa siif jiran waliin qoradhu. Akkasumas safara adda addaa walitti makuu fi walsimsiisuu dandeessa.

Akeekkachiisa durtii

.alertErgaa akeekkachiisa akeekkachiisaa bu'uuraaf barruu kamiyyuu fi qaree filannoo ari'uu keessa marsi .

Akeekkachiisa! Best check yo self, ati baayyee gaarii hin fakkaattu.

<div class = "akeekkachiisa" > 
  < gosa qaree = "button" class = "cufi" data-dismiss = "akeekkachiisa" > × </button> jedhu   
  <strong> Akeekkachiisa! </strong> Best check yo self, ati baayyee gaarii hin fakkaattu.
</div> jechuun ni danda’ama

Qabduulee hojii irraa ari'uu

Mobile Safari fi Mobile Opera browsers, data-dismiss="alert"attribute dabalatee, yeroo tag href="#"fayyadamtan akeekkachiisa kuffisuuf an barbaadu.<a>

<a href = "#" class = "cufi" deetaa-kuffisuu = "akeekkachiisa" > &yeroo; </a> jechuun ni danda’ama

Akka filannootti, elementii amaloota deetaa qabu fayyadamuu dandeessa <button>, kan nuti docs keenyaaf gochuu filanneerra. Yeroo fayyadamtu <button>, dabaluu qabda type="button"ykn unkaawwan kee dhiyeessu dhiisuu danda’u.

< gosa qaree = "button" class = "cufi" data-dismiss = "akeekkachiisa" > × </button> jedhu

Akeekkachiisa karaa JaavaScript kuffisi

Akeekkachiisa saffisaa fi salphaatti kuffisuuf plugin jQuery akeekkachiisaa fayyadami .

Filannoowwan

Ergaawwan dheeraadhaaf, paadiingii gubbaa fi jala marfata akeekkachiisaa irratti dabaluudhaan dabali .alert-block.

Akeekkachiisa!

Best check yo self, ati baayyee gaarii hin fakkaattu. Nulla vitae elit libero, afaan oromoo kan afaan oromoo fi hiika isaa pdf. Praesent commodo cursus magna, vel scelerisque nisl consectetur fi kan jedhaman kanneen akka.

<div class = "akeekkachiisa-uggura" > 
  < gosa qaree = "button" class = "cufi" data-dismiss = "akeekkachiisa" > × </button> jedhu   
  <h4> Akeekkachiisa! </h4> jechuun ni danda’ama
  Best check yo self, ati hin jirtu...
</div> jechuun ni danda’ama

Filannoowwan haala dubbiitiin

Hiika akeekkachiisaa jijjiiruuf gita filannoo dabali.

Dogoggora ykn balaa

Yaa snap! Wantoota muraasa ol jijjiirii irra deebi'ii galchuu yaali.

<div class = "dogongora-akeekkachiisa akeekkachiisaa" > 
  ...
</div> jechuun ni danda’ama

Milkaa'ina

Gaarii goote! Ergaa akeekkachiisaa barbaachisaa ta'e kana milkaa'inaan dubbisteetta.

<div class = "milkaa'ina-akeekkachiisa akeekkachiisaa" > 
  ...
</div> jechuun ni danda’ama

Odeeffannoo

Mataa ol qaba! Alert kun xiyyeeffannoo keessan barbaada, garuu super important miti.

<div class = "odeeffannoo-akeekkachiisa akeekkachiisaa" > 
  ...
</div> jechuun ni danda’ama

Fakkeenyaafi mallattoo

Bu'uura

Sajoo adeemsa durtii kan garagalcha dhaabbataa qabu.

<div class = "adeemsa" > 
  <div gita = "bar" akkaataa = " bal'ina : 60 %; " ></div>   
</div> jechuun ni danda’ama

Sarara kan qabu

Bu'aa sarara qabu uumuuf garagalcha fayyadama. IE7-8 keessatti hin argamu.

<div class = "adeemsa adeemsa-sarara" > 
  <div gita = "bar" akkaataa = " bal'ina : 20 %; " ></div>   
</div> jechuun ni danda’ama

Animeeshinii kan qabu

Sararoota mirgaa gara bitaatti sochoosuuf gara .activeitti dabali . .progress-stripedVersion IE hunda keessatti hin argamu.

<div class = "adeemsa adeemsa-sarara socho'aa" > 
  <div gita = "bar" akkaataa = " bal'ina : 40 %; " ></div>   
</div> jechuun ni danda’ama

Tuulamaa

.progressIsaan tuuluuf barruulee hedduu tokko keessa kaa'i .

<div class = "adeemsa" > 
  <div class = "bar bar-milkaa'ina" style = " bal'ina : 35 %; " ></div>   
  <div class = "bar bar-akeekkachiisa" style = " bal'ina : 20 %; " ></div>   
  <div class = "bar bar-balaa" style = " bal'ina : 10 %; " ></div>   
</div> jechuun ni danda’ama

Filannoowwan

Halluuwwan dabalataa

Sajoo adeemsaa qaree walfakkaataa tokko tokko fi gita akeekkachiisaa akkaataa walfakkaataaf fayyadamu.

<div class = "odeeffannoo adeemsa adeemsaa" > 
  <div gita = "bar" akkaataa = " bal'ina : 20 % " ></div>   
</div> jechuun ni danda’ama
<div class = "adeemsa adeemsa-milkaa'ina" > 
  <div gita = "bar" akkaataa = " bal'ina : 40 % " ></div>   
</div> jechuun ni danda’ama
<div class = "adeemsa-akeekkachiisa" > 
  <div gita = "bar" akkaataa = " bal'ina : 60 % " ></div>   
</div> jechuun ni danda’ama
<div class = "adeemsa adeemsa-balaa" > 
  <div gita = "bar" akkaataa = " bal'ina : 80 % " ></div>   
</div> jechuun ni danda’ama

Barruulee sarara qaban

Halluuwwan jajjaboo wajjin wal fakkaatuun, barruulee adeemsaa sarara adda addaa qaban qabna.

<div class = "adeemsa adeemsa-odeeffannoo adeemsa-sarara" > 
  <div gita = "bar" akkaataa = " bal'ina : 20 % " ></div>   
</div> jechuun ni danda’ama
<div class = "adeemsa adeemsa-milkaa'ina adeemsa-sarara" > 
  <div gita = "bar" akkaataa = " bal'ina : 40 % " ></div>   
</div> jechuun ni danda’ama
<div class = "adeemsa adeemsa-akeekkachiisa adeemsa-sarara" > 
  <div gita = "bar" akkaataa = " bal'ina : 60 % " ></div>   
</div> jechuun ni danda’ama
<div class = "adeemsa adeemsa-balaa adeemsa-sarara" > 
  <div gita = "bar" akkaataa = " bal'ina : 80 % " ></div>   
</div> jechuun ni danda’ama

Deeggarsa biraawzari

Sajoo adeemsaa bu'aa isaanii hunda galmaan ga'uuf garaagarummaa CSS3, ce'umsaa, fi sochiiwwan fayyadamu. Amaloonni kun IE7-9 ykn gosoota Firefox durii keessatti hin deeggaraman.

Versions Internet Explorer 10 fi Opera 12 dura turan sochii qaamaa hin deeggaran.

Akkaataa wanta abstraaktii gosoota qaamolee adda addaa ijaaruuf (akka yaada biloogii, Tweets, fi kkf) kanneen fakkii bitaa- ykn mirga-hiriirfame qabiyyee barruu cinatti agarsiisan.

Fakkeenya durtii

Miidiyaan durtii wanta miidiyaa (fakkiiwwan, viidiyoo, sagalee) gara bitaa ykn mirga uggura qabiyyee yaa'uuf hayyama.

Mata duree miidiyaa

Cras taa'u amet nibh libero, keessatti gravida nulla. Nulla vel metus scelerisque ante sollicitudin koomoodoo jedhamuun beekama. Cras purus odio, vestibulum vulputate keessatti argamu irratti, tempus viverra turpis. Fusce condimentum nunc ac nisi firiingiilaa vulputate jedhamuun beekama. Donec lacinia congue felis jedhamu kan faucibus keessatti argamu.

Mata duree miidiyaa

<div class = "miidiyaa" > 
  <a class = "harkisuu-bitaa" href = "#" >  
    <img gita = "wanta-miidiyaa" deetaa-src = "qabaa.js/64x64" >  
  </a> jechuun ni danda’ama
  <div class = "qaama-miidiyaa" > 
    <h4 class = "media-heading" > Mata duree miidiyaa </h4> 
    ...
 
    <!-- Wanti miidiyaa man'ee -->
    <div class = "miidiyaa" > 
      ...
    </div> jechuun ni danda’ama
  </div> jechuun ni danda’ama
</div> jechuun ni danda’ama

Tarree miidiyaa

Xiqqoo mallattoo dabalataatiin, miidiyaa tarree keessaa fayyadamuu dandeessa (dhangiiwwan yaada ykn tarreewwan barruuleedhaaf faayidaa qaba).

Mata duree miidiyaa

Cras taa'u amet nibh libero, keessatti gravida nulla. Nulla vel metus scelerisque ante sollicitudin koomoodoo jedhamuun beekama. Cras purus odio, vestibulum vulputate keessatti argamu irratti, tempus viverra turpis.

Mata duree miidiyaa nested
Cras taa'u amet nibh libero, keessatti gravida nulla. Nulla vel metus scelerisque ante sollicitudin koomoodoo jedhamuun beekama. Cras purus odio, vestibulum vulputate keessatti argamu irratti, tempus viverra turpis.

Mata duree miidiyaa nested
Cras taa'u amet nibh libero, keessatti gravida nulla. Nulla vel metus scelerisque ante sollicitudin koomoodoo jedhamuun beekama. Cras purus odio, vestibulum vulputate keessatti argamu irratti, tempus viverra turpis.

Mata duree miidiyaa nested
Cras taa'u amet nibh libero, keessatti gravida nulla. Nulla vel metus scelerisque ante sollicitudin koomoodoo jedhamuun beekama. Cras purus odio, vestibulum vulputate keessatti argamu irratti, tempus viverra turpis.
Mata duree miidiyaa
Cras taa'u amet nibh libero, keessatti gravida nulla. Nulla vel metus scelerisque ante sollicitudin koomoodoo jedhamuun beekama. Cras purus odio, vestibulum vulputate keessatti argamu irratti, tempus viverra turpis.

<ul class = "tarree-miidiyaa" > 
  <li class = "miidiyaa" > 
    <a class = "harkisuu-bitaa" href = "#" >  
      <img gita = "wanta-miidiyaa" deetaa-src = "qabaa.js/64x64" >  
    </a> jechuun ni danda’ama
    <div class = "qaama-miidiyaa" > 
      <h4 class = "media-heading" > Mata duree miidiyaa </h4> 
      ...
 
      <!-- Wanti miidiyaa man'ee -->
      <div class = "miidiyaa" > 
        ...
     </div> jechuun ni danda’ama
    </div> jechuun ni danda’ama
  </li> jechuun ni danda’ama
</ul> jechuun ni danda’ama

Wells jedhama

Boolla akka bu'aa salphaa elementii tokko irratti fayyadamii bu'aa galtee kennuudhaaf.

Ilaa ani boolla bishaanii keessa jira!

<div gita = "tole" > 
  ...
</div> jechuun ni danda’ama

Kutaawwan filannoo

Paadiingii fi goleewwan geengoo gita fooyyessaa filannoo lamaa wajjin too'adhu.

Ilaa ani boolla bishaanii keessa jira!

<div class = "akka gaariitti-guddaa" > 
  ...
</div> jechuun ni danda’ama

Ilaa ani boolla bishaanii keessa jira!

<div class = "tole akka gaariitti-xiqqaa" > 
  ...
</div> jechuun ni danda’ama

Mallattoo cufi

Qabiyyee akka moodaalotaa fi akeekkachiisa kuffisuuf mallattoo cufiinsa waliigalaa fayyadami.

<button class = "cufi" > &yeroo; </button> jedhu

Meeshaaleen iOS href="#"taateewwan cuqaasuuf yoo anchor fayyadamuu barbaadde barbaadu.

<a class = "cufi" href = "#" > &yeroo;  </a> jechuun ni danda’ama

Kutaa gargaaraa

Gitoota salphaa, xiyyeeffannoo agarsiisa xixiqqoo ykn jijjiirama amalaaf.

.harkisuu-bitaa

Elementii tokko gara bitaatti yaa'i

class = "harkisuu-bitaa".

. harkisuu - bitaa { .
  float : bitaa ;
} .

.harkisuu-mirga

Elementii tokko mirga yaa'i

class = "harkisuu-mirgaa".

. harkisuu - mirgaa { .
  float : mirgaa ;
} .

.muted ta'e

Halluu elementii tokkoo gara#999

class = "kan dhaamfame".

. callisee { .
  halluu : #999; 
} .

.qulqulleessuu

floatElementii kamiyyuu irratti kan qulqulleessi

class = "qulqulleessuu".

. qulqulleessuu { .
  * guddisuu : 1 ; 
  &: dura , .
  &: booda { .
    agarsiisa : gabatee ;
    qabiyyee : "" ; 
  } .
  &: booda { .
    ifa : lamaan isaanii ;
  } .
} .

Menuuwwan gadi bu'an

Fakkeenya

Markup gochuu

Filannoowwan

Menuuwwan qindeessuu

Filannoowwan menu hanqifaman

Menuuwwan xiqqaa kanneen gadi bu'an irratti

Gareewwan buttooni

Fakkeenyaaf

Garee button tokko

Gareewwan buttooni hedduu

Gareewwan buttooni dhaabbataa

Sanduuqa filannoo fi mi'aawwan raadiyoo

Garee qaree keessatti gadi bu'aa

Menuuwwan buttooni gadi bu'an

Haala waliigalaa fi fakkeenya

Safara buttooni hunda waliin hojjeta

JaavaScript barbaada

Tarreewwan qaree addaan qoodi

Saayiziiwwan

Menuuwwan gadi bu'an

Nav: caancalaa, kiniinii, fi tarreewwan

Durtii salphaa Mallattoo walfakkaataa, gita adda addaa

Caancaloota bu'uuraa

Kiniinii bu'uuraa

Haala hanqifame

Hiriirsa qaamolee

Tuulamaa kan danda'u

Caancaloota walitti tuulaman

Kiniinii walitti tuulame

Dropdowns kan jedhu

Caancaloota kanneen gadi bu'an qaban

Kiniinii kan dropdown qabu

Tarreewwan Nav

Fakkeenya tarree nav

Qoqqoodduu horizontaalaa

Tabbataa nav

Fakkeenya gabatee

Caancala keessatti fade

Ijaarsa jQuery barbaada

Kallattii kamiinuu tabbachuu danda'a

Caancaloota jala jiran

Caancala bitaa irratti argamu

Caancalawwan gara mirgaa jiran

Navbar jedhama

Navbar bu'uuraa

Qaamolee Navbar

Maqaa oomishaa

Nav hidhaa

Unkaalee

Unka barbaadi

Hiriirsa qaamolee

Gadi bu'oota fayyadamuu

Barreeffama

Jijjiirama agarsiisa filannoo

Gubbaa irratti dhaabbataa ta'e

Gara jalaatti sirreeffame

Navbar gubbaa istaatiksii

Navbar deebii kan kennu

Jijjiirama garagalfame

Daabboo

Fakkeenyaaf

Fuula Filannoo lama qabiyyee keessaa fuula baasuuf

Fuula istaandaardii

Filannoowwan

Haalata hanqifamee fi socho'aa

Saayiziiwwan

Hiriirsuu

Pager jedhamuun beekama

Fakkeenya durtii

Hidhamtoota qindaa'an

Haalata hanqifame filannoo

Asxaalee fi baajii

Asxaalee

Baajiiwwan

Salphaatti kan kufamu

Qaamolee maxxansaa

Goota kutaa

Akkam jirtu addunyaa!

Mata duree fuula