Jumbotronilla saa isoja otsikkotekstejä: (arvauksia, mistä nimi...)

Bootstrap-esimerkki

Bootstrap on suosituin HTML-, CSS-, sekä JS-framework responsiivisten mobiili ensin -projektien tuottamiseen webissä.

Vähän tekstiä Jumbotronin alla....

Toinen kappale....

Koodihan toimii näin: (kuva, koodin saa lähdekoodista). Kuva ei ole enää .container-luokan sisällä.

jumbotron

Sarakkeilla saa ryhmiteltyä tekstiä. Sarakkeita Bootstrapissa voi olla 12 kpl. Sarakkeissa voi ilmoittaa, monenko sarakkeen leveyden (span) ne sisältävät. Yhteissumma ei voi ylittää lukua 12.

Esimerkiksi tässä kaksi saraketta, joista molemmat ovat kuusi saraketta (täyttää siis koko sivun leveyden)

Eka sarake
toinen sarake

Sarakkeille annettu oma värikoodi, jotta ne erottuisivat:

sarakkeet

Sarakemäärittelyyn liittyy myös laitekoodi, joka vaikuttaa kokoon. Tässä koodi on "sm". Koodit ovat seuraavat:

  1. xs - puhelimille
  2. sm - tabletit
  3. md - työpöytänäytöt
  4. lg - suuret työpöytänäytöt

Tässä vielä toinen esimerkki suurille työpöytänäytöille. Esimerkissä on kolme saraketta, span 2,4 6:

Eka sarake
toinen sarake
kolmas sarake

Ja sama kuvana:

kolme saraketta
Paluu edelliselle sivulle...