Asemointi
Esimerkki
Tehtävä 13
Suunnittele sivulle sisältöä jossa on otsikko-osio, navigointipalkki, varsinaista pääsisältöä ja alatunniste.
Perehdy sivuun https://www.w3schools.com/html/html_layout.asp
Toteuta asemointi eli layout CSS-tyylitiedostolla.
Perehdy sivuun https://www.w3schools.com/html/html_layout.asp
Toteuta asemointi eli layout CSS-tyylitiedostolla.
Asemoinnissa ja ulkoasun määrittämisessä tarvittavia käsitteitä
Asemoinnilla (layout) tarkoitetaan sitä miten sivn eri osaset sijoitellaan toisiinsa nähden.
Asemoinnissa ja tyylimäärittelyissä on hyödyllistä määritellä htmlkoodissa sivulle eri osia mm. <div> -elementin ja Id-tunnisteiden avulla.
Lue sivu https://www.w3schools.com/html/html_blocks.asp
Mieti mitä käsitteet "Block element" ja "Inline element" tarkoittavat.
Miten div ja span elementtejä käytetään:
https://koppa.jyu.fi/avoimet/hum/tvt/www/css/div-ja-span
Miten sivun osiin määritetään luokkia Class ja yksilöllisiä tunnisteita (Id):
https://www.w3schools.com/html/html_classes.asp
https://www.w3schools.com/html/html_id.asp
Sivun eri osien asemoinnissa voidaan myös käyttää tagejä
<header>
- otsikko<nav>
- navigointilinkit sivuston sisällä<section>
- osio<article>
- itsenäinen sisältöosio<aside>
- sivupalkki<footer>
- alatunniste