Basis > Templates

Met een vooraf ingesteld template werken is handig omdat je hierdoor sneller met minder regels code kan coderen. Het bevat elementen (zoals buttons, forms, of panels) die met een regel code al css en of javascript bevatten. De code van een Bootstrap template werkt hierdoor alleen in dat template en niet als code in een Skeleton template. Op de websites van de verschillende templates kan je zien wat er met het template mogelijk is.

Stel je voor dat je een button wilt maken. Dit doe je bijvoorbeeld door in html het volgende te schrijven.

<button type="button">Html Button</button>

In een leeg template, zonder css (styling) ziet het er zo uit: leeg template Dit is een niet aantrekkelijke button en via css ga je het volledig stylen zoals je, je button zou willen. Dit kan je best veel tijd kosten, een voorbeeld van de styling zie je hieronder:

.button {
    background-color: #4CAF50;      
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}

De button zie er dan als volgt uit.

Met nodum template heb je de groene button in 1 regel geschreven. Als je erover heen gaat met je muis dan krijgt hij schaduw, waardoor hij een driedimensionaal effect krijgt. Kortom een nog mooiere button. nodum template

<button type="button" class="btn btn-groen waves-effect">nodum template</button>

Bootstrap template
Bootstrap maakt gebruik van een 12 grid responsive layout en custom jQuery plugins om interactie zoals, carrousels en modal vensters te gebruiken. Voor meer informatie kijk op de website van Bootstrap.

Skeleton template
Skeleton is een framework met simpele elementen om snel een basis responsive website op te zetten. Skeleton maakt gebruik van een grid layout, CSS media-queries. formulieren, buttons, typografie en een fallback voor oudere browsers zonder HTML5 ondersteuning. Voor meer uitleg, kijk op de site van Skeleton

Foundation template
Het onderscheidt zich door ingebouwde jQuery gedreven features, standaard iconen, buttons, menu's en de mogelijkheid om zeer snel volledig responsive prototypes in elkaar te zetten op basis van sjablonen. Voor meer informatie kijk op de website van Foundation of voor code voorbeelden

Nodum template
Dit template is een uitbreiding op Twitter Bootstrap, een HTML5 template waar standaard al HTML, CSS en Javascript in zit om een quick start te maken. Voor meer uitleg bekijk de documentatie hierover op de website.

Leeg template
hier zit geen standaard html-css-javascript elementen opmaak in. Alles is zelf vorm te geven met eigen css, javascript en html.