Julkiset tietoverkot

Sorakuilu

CSS-Harjoitus 6, Bootstrap

Toteuta seuraavan kuvasarjan mukainen käyttöliittymä hyödyntäen Bootstrapia

iso ruutu
keskiruutu
tabletti
puhelin

Article on isossa 10 sarakkeen levyinen, aside 2:n.

Voit myös tehdä muutoksia suunnitelmaan. Piirrä siinä tapauksessa ensin suunnitelma kuvankäsittelyohjelmalla.

Palauta työ nimellä cssharj6.html.

ratkaisu kuvana

Etene seuraavasti

  1. Tee ensin div class="container"
  2. Tee sen sisälle kolme rivielementtiä div class="row"
  3. Tee ensimmäiseen riviin header-elementti
  4. tee toiseen riviin nav-elementti
  5. Tee kolmanteen riviin elementit article, figure (tai div id="kuva") ja aside
  6. Tee neljänteen riviin footer-elementti