CSS Sisennykset (padding)

CSS-sisennykset (padding) tarkoittaa sisätilan lisäämistä HTML-elementin ympärille. Paddingia käytetään yleensä antamaan tilaa elementin sisältämälle sisällölle. CSS-paddingia voidaan käyttää esimerkiksi painikkeiden, kuvien ja tekstilaatikoiden suunnittelussa.

Sisennys voidaan määrittää käyttämällä padding -ominaisuutta. Voit määrittää sisätilan ylä-, ala-, oikealle ja vasemmalle puolelle erikseen, tai voit määrittää sisätilan kaikille puolille kerralla. Esimerkiksi, jos haluat lisätä 10 pikselin paddingin vasemmalle puolelle, voit kirjoittaa seuraavan säännön:

1padding-left: 10px;

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

1padding: 10px;

CSS-paddingin käyttöä on tärkeä harkita suunnitellessasi sivustoa, sillä liiallinen padding voi tehdä sivusta epäselvän ja hankalasti luettavan. Toisaalta, liian vähäinen padding voi tehdä sivusta ahtaan ja epämiellyttävän katsella.

CSS-paddingin lisäksi voit käyttää myös margin-ominaisuutta, joka määrittää elementin ulkopuolisen tilan. Marginia käytetään yleensä antamaan tilaa elementin ympärille, kun taas paddingia käytetään antamaan tilaa elementin sisälle.

Harjoittele