Bootstrap

Hanomboka

Overview ny tetikasa, ny votoatiny, ary ny fomba hanombohana amin'ny môdely tsotra.

1. Download

Alohan'ny hisintonana dia aoka ho azo antoka fa manana tonian-dahatsoratry ny kaody (manolotra ny Sublime Text 2 izahay ) ary fahalalana sasany momba ny HTML sy CSS. Tsy handeha hamaky ireo rakitra loharano eto izahay, fa azo alaina maimaim-poana izy ireo. Hifantoka amin'ny fanombohana ny rakitra Bootstrap natambatra izahay.

Natambatra ny fampidinana

Fomba haingana indrindra hanombohana: alaivo ny dikan-teny voaangona sy nohavaozina amin'ny CSS, JS ary sary. Tsy misy antontan-taratasy na rakitra loharano tany am-boalohany.

Download Bootstrap

Loharano alaina

Raiso ny rakitra tany am-boalohany ho an'ny CSS sy Javasript rehetra, miaraka amin'ny dika mitovy eo an-toerana amin'ny alàlan'ny fampidinana mivantana avy amin'ny GitHub ny kinova farany.

Ampidino ny loharano Bootstrap

2. Firafitry ny rakitra

Ao anatin'ilay fampidinana dia ho hitanao ity firafitry ny rakitra manaraka ity sy ny atiny, manambatra ny fananana iombonana ara-lojika ary manome fiovaovana voaangona sy nohamafisina.

Vantany vao alaina dia sokafy ny lahatahiry voatsindry hahitana ny firafitry ny (ilay natambatra) Bootstrap. Hahita zavatra toy izao ianao:

  bootstrap / ├── css / │ ├── bootstrap . css
   │ ├── bootstrap . min . css
   ├── js / │ ├── bootstrap . js
   │ ├── bootstrap . min . js
   ├── img / │ ├── glyphicons - halflings . png
   │ ├── glyphicons - halflings - fotsy . png
  
  
        
        
        └── VAKINY . md

Ity no endrika fototra indrindra amin'ny Bootstrap: rakitra natambatra ho an'ny fampidinana haingana amin'ny tetikasa web rehetra. Manome CSS sy JS ( bootstrap.*), ary koa CSS sy JS ( bootstrap.min.*). Ny rakitra sary dia voatsindry amin'ny fampiasana ImageOptim , fampiharana Mac amin'ny fanerena PNG.

3. Inona no tafiditra

Ny Bootstrap dia tonga miaraka amin'ny HTML, CSS, ary JS ho an'ny karazan-javatra rehetra, saingy azo fintinina amin'ny sokajy vitsivitsy hita eo an-tampon'ny antontan-taratasy Bootstrap .

fizarana Docs

torolalana

Fomba eran'izao tontolo izao ho an'ny vatana hamerenana ny karazana sy ny fiaviana, ny fomba fampifandraisana, ny rafitra grid, ary ny fandrafetana tsotra roa.

Base CSS

Styles ho an'ny singa HTML mahazatra toy ny typography, code, tables, forms, ary bokotra. Ahitana ihany koa ny Glyphicons , setroka kisary kely lehibe.

singa

Fomba fototra ho an'ny singa interface tsara toy ny tabilao sy pilina, navbar, fanairana, lohatenin'ny pejy, sy ny maro hafa.

Javascript plugins

Mitovy amin'ny Components, ireo plugins Javascript ireo dia singa ifanakalozan-kevitra ho an'ny zavatra toy ny tooltips, popovers, modals, sy ny maro hafa.

Lisitry ny singa

Miaraka, ny fizarana plugins Components sy Javascript dia manome ireto singa interface manaraka ireto:

  • Vondrona bokotra
  • Bokotra midina
  • Tabilao navigateur, pilina ary lisitra
  • Navbar
  • etikety
  • Badges
  • Lohatenin'ny pejy sy vondrona mahery fo
  • vinety
  • fanairana
  • Bara fandrosoana
  • Modals
  • Dropdowns
  • Tooltips
  • Popovers
  • angorodao
  • Carousel
  • Typeahead

Ao amin'ny torolalana ho avy, afaka mamaky tsirairay ireo singa ireo amin'ny antsipiriany bebe kokoa isika. Mandra-pahatongan'izany, tadiavo ny tsirairay amin'izy ireo ao amin'ny tahirin-kevitra mba hahazoana fampahalalana momba ny fomba fampiasana sy fanamboarana azy ireo.

4. môdely HTML fototra

Miaraka amin'ny fampidirana fohy amin'ny atiny, afaka mifantoka amin'ny fampiasana Bootstrap isika. Mba hanaovana izany dia hampiasa môdely HTML fototra isika izay ahitana ny zavatra rehetra voalazanay ao amin'ny firafitry ny File .

Ankehitriny, jereo ny rakitra HTML mahazatra :

  1. <html>
  2.   <loha>
  3.     <title> Template Bootstrap 101 </title>
  4.   </head>
  5.   <vatana>
  6.     <h1> Miarahaba, izao tontolo izao! </h1>
  7.   </body>
  8. </html>

Mba hahatonga ity modely Bootstrapped ity dia ampidiro fotsiny ny rakitra CSS sy JS mety:

  1. <html>
  2.   <loha>
  3.     <title> Template Bootstrap 101 </title>
  4.     <!-- Bootstrap -->
  5.     <link href = "css/bootstrap.min.css" rel = "stylesheet" >  
  6.   </head>
  7.   <vatana>
  8.     <h1> Miarahaba, izao tontolo izao! </h1>
  9.     <script src = "js/bootstrap.min.js" ></script> 
  10.   </body>
  11. </html>

Ary efa vonona ianao! Miaraka amin'ireo rakitra roa ireo dia afaka manomboka mamolavola tranokala na fampiharana amin'ny Bootstrap ianao.

5. Ohatra

Mandehana any ivelan'ny môdely fototra miaraka amin'ny fandrafetana ohatra vitsivitsy. Mamporisika ny olona izahay hamerina ireo ohatra ireo fa tsy hampiasa azy ireo ho vokatra farany.

  • Tranonkala marketing fototra

    Ahitana vondrona mahery fo ho an'ny hafatra voalohany sy singa telo manohana.

  • Fametrahana ranon-javatra

    Mampiasa ny rafi-pandrefesana mivaingana vaovao ataonay mba hamoronana fandrafetana ranon-javatra mirindra.

  • Modely fanombohana

    Taratasy HTML barebones miaraka amin'ny Bootstrap CSS sy javascript rehetra.

Inona no manaraka?

Mankanesa any amin'ny doka raha mila fampahalalana, ohatra, ary sombin-kaody, na alao ny dingana manaraka ary amboary ny Bootstrap ho an'ny tetikasa ho avy.

Tsidiho ny docs Bootstrap Amboary ny Bootstrap