CSS Marginaalit

CSS-marginaali tarkoittaa ulkotilan lisäämistä HTML-elementin ympärille. Marginaalia käytetään yleensä antamaan tilaa elementin ympärille tai erottamaan elementtiä muista elementeistä. CSS-marginaalin avulla voit luoda välit elementtien välille ja asettaa elementit haluttuun paikkaan.

Marginaalin määrittämiseen käytetään margin-ominaisuutta. Voit määrittää marginaalin ylä-, ala-, oikealle ja vasemmalle puolelle erikseen, tai voit määrittää marginaalin kaikille puolille kerralla. Esimerkiksi, jos haluat lisätä 10 pikselin marginaalin yläpuolelle, voit kirjoittaa seuraavan säännön:

1margin-top: 10px;

Voit myös määrittää marginaalin kaikille puolille kerralla käyttämällä seuraavaa sääntöä:

1margin: 10px;

CSS-marginaalin käyttöä on tärkeä harkita suunnitellessasi sivustoa, sillä liian suuri marginaali voi tehdä sivusta ahtaan ja epämiellyttävän katsella, kun taas liian pieni marginaali voi tehdä sivusta epäselvän ja hankalasti luettavan.

CSS-marginaalin lisäksi voit käyttää myös edellisessä moduulissa käsiteltyä padding-ominaisuutta, joka määrittää elementin sisätilan. Paddingia käytetään yleensä antamaan tilaa elementin sisällölle, kun taas marginaalia käytetään antamaan tilaa elementin ympärille.

Harjoittele