Framlengdu Bootstrap til að nýta meðfylgjandi stíla og íhluti, sem og MINNI breytur og blöndun.
Bootstrap er búið til með MESS í kjarnanum, kraftmiklu stílblaðsmáli búið til af góðum vini okkar, Alexis Sellier . Það gerir þróun kerfisbundins CSS hraðari, auðveldari og skemmtilegri.
Einn af höfundum Bootstrap skrifaði stutta bloggfærslu um þetta , dregin saman hér:
Sem framlenging á CSS inniheldur LESS breytur, blöndun fyrir endurnotanlega kóðabúta, aðgerðir fyrir einfalda stærðfræði, hreiður og jafnvel litaaðgerðir.
Farðu á opinberu vefsíðuna á http://lesscss.org/ til að læra meira.
Þar sem CSS okkar er skrifað með Less og notar breytur og blöndun, þarf að setja það saman fyrir endanlega framleiðsluútfærslu. Hér er hvernig.
Fylgdu leiðbeiningunum í readme verkefnisins á GitHub til að setja saman í gegnum skipanalínuna.
Sæktu nýjasta Less.js og taktu leiðina að því (og Bootstrap) inn í <head>
.
<link rel = "stylesheet/less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>
Til að setja saman .less skrárnar aftur skaltu bara vista þær og endurhlaða síðuna þína. Less.js safnar þeim saman og geymir í staðbundinni geymslu.
Óopinbera Mac appið horfir á möppur yfir .less skrár og safnar kóðanum saman í staðbundnar skrár eftir hverja vistun á .less skrá sem horft er á. Ef þú vilt geturðu skipt um kjörstillingar í appinu fyrir sjálfvirka minnkun og í hvaða möppu söfnuðu skrárnar enda í.
Marr er frábær útlítandi MINNA ritstjóri og þýðandi byggður á Adobe Air.
Búið til af sama gaur og óopinbera Mac appið, CodeKit er Mac app sem setur saman LESS, SASS, Stylus og CoffeeScript.
Mac, Linux og Windows app til að draga og sleppa samantekt á MÆRI skrám. Auk þess er frumkóði á GitHub .
Byrjaðu fljótt hvaða vefverkefni sem er með því að sleppa inn samansettum eða minnkaðri CSS og JS. Leggðu á sérsniðna stíla sérstaklega til að auðvelda uppfærslur og viðhald áfram.
Sæktu nýjustu samansettu Bootstrap og settu inn í verkefnið þitt. Til dæmis gætirðu haft eitthvað eins og þetta:
app/ skipulag/ sniðmát/ opinber/ css/ bootstrap.min.css js/ bootstrap.min.js img/ glyphicons-halflings.png glyphicons-halflings-white.png
Afritaðu eftirfarandi grunn HTML til að byrja.
- <html>
- <haus>
- <title> Bootstrap 101 sniðmát </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stílblað" >
- </head>
- <líkami>
- <h1> Halló, heimur! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- </body>
- </html>
Vinndu í sérsniðnu CSS, JS og fleira eftir þörfum til að gera Bootstrap að þínu eigin með þínum eigin aðskildum CSS og JS skrám.
- <html>
- <haus>
- <title> Bootstrap 101 sniðmát </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stílblað" >
- <!-- Verkefni -->
- <link href = "public/css/application.css" rel = "stílblað" >
- </head>
- <líkami>
- <h1> Halló, heimur! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- <!-- Verkefni -->
- <script src = "public/js/application.js" ></script>
- </body>
- </html>