2.3 Komponenter

Du kan bruke HTML-kode på alle sidene og det er nokså enkelt å få til ved å klikke kodevisning-ikonet i redigeringsprogrammet. Her er eksempler på kode du kan kopiere og lime inn på alle sider og bloggsider.

Først en enkek tabell:

# Fornavn Etternavn Tittel
1 Ola Normann Webdesigner
2 Kari
Jakke Daglig leder
3 Larry Test
@twitter


Alert-bokser

Her kan du leke med fargene til bootstrap. Du kan variere mellom default, info, success, warning, danger. Tilsvarende er på det meste av tekst og html-elementer.

<div class="alert alert-primary" role="alert">
    En enkel boks med litt farge og en <a href="#" class="alert-link">lenke</a>. </div>


Paneler

<div class="panel panel-default">
  <div class="panel-heading">Panel Heading</div>
  <div class="panel-body">Panel Content</div>
</div>

Overskrift
Innhold her

Fargepalett

Disse css-klassene kan du legge på all tekst, inkludert ikoner, direkt på tekst i Word-redigeringsprogrammet vårt. Eller i de ferdige boksene/ikon-klassene fra feature-listene.

<div class="container">
  <p>Use the contextual classes to provide "meaning through colors":</p>
  <p class="text-muted">This text is muted.</p>
  <p class="text-primary">This text is important.</p>
  <p class="text-success">This text indicates success.</p>
  <p class="text-info">This text represents some information.</p>
  <p class="text-warning">This text represents a warning.</p>
  <p class="text-danger">This text represents danger.</p>
</div>

Use the contextual classes to provide "meaning through colors":

This text is muted.

This text is important.

This text indicates success.

This text represents some information.

This text represents a warning.

This text represents danger.

Sitater

Brukes for å skille ut teksten fra vanlig tekst.

<blockquote>
    <p>LettLanding gjør landingssidene morsomme</p>
    <footer>Fra LettLanding.no</footer>
  </blockquote>

LettLanding gjør landingssidene morsomme

Fra LettLanding.no

Flere eksempler

Besøk for eksempel w3schools.com.