Useimmiten HTML-sivujen sisennysten koon määrittämiseksi käytetään CSS-kielen (Cascading Style Sheets) ominaisuuksia. Vaikka itse HTML-kielessä on useita "alkeellisia" jäännöksiä, joiden avulla joissakin tapauksissa voidaan asettaa sisennys. Alla on vaihtoehtoja, joita käytetään useimmiten, mutta niiden lisäksi on vielä melko paljon erilaisia temppuja, joiden avulla voit asettaa sisennyksiä HTML-asiakirjojen epätyypillisille merkinnöille.
Se on välttämätöntä
Perustiedot HTML- ja CSS-kielistä
Ohjeet
Vaihe 1
Määritä sivuelementti, josta sisennetään. Esimerkiksi, jos teksti sijoitetaan tunnisteen … (lohko) sisälle, tämä lohko on tämän tekstin pääelementti ja sisennys tulisi laskea lohkon rajoista. Ja jos teksti (tai kuva) ei ole minkään lohkon (div, li jne.) Tai inline (span, p, jne.) Elementtien sisällä, niin sen vanhempi on dokumentin runko (body tag). Vanhemman elementin määritteleminen tekstille on välttämätöntä, koska hänen on määritettävä sisennysten muodostavien tyylien kuvaukset. Oletetaan, että tekstisi on sijoitettu div-lohkoon: Esimerkkiteksti
Vaihe 2
Käytä CSS-kielimarginaaliominaisuutta asettaaksesi marginaalit eli etäisyyden elementin rajoista vierekkäisiin elementteihin sekä pääelementin rajoihin. Tämä etäisyys voidaan asettaa erikseen kummankin puolen pehmusteille: marginaali ylhäältä - ylhäältä, marginaali oikealta - oikealta, marginaali alhaalta - alhaalta, marginaali vasemmalta - vasemmalta. Yllä olevassa esimerkissä tämä css-koodi saattaa näyttää tältä: div {
yläreuna: 10 kuvapistettä;
marginaali oikea: 15 kuvapistettä;
alareuna: 40 kuvapistettä;
marginaali vasemmalla: 70px;
} Tässä "div" on valitsin, joka määrittää, että tätä tyyliä tulee soveltaa kaikkiin dokumenttikoodin div-osiin. CSS-syntaksin avulla voit yhdistää kaikki neljä riviä yhdeksi: div {
marginaali: 10px 15px 40px 70px;
} Sisennysten arvot on määritettävä aina tässä järjestyksessä: ensin - ylhäältä, sitten - oikealta, alhaalta ja vasemmalta. Jos sisennykset ovat samat kaikilla puolilla, riittää, että määrität arvon kerran: div {
marginaali: 70px;
} Lisäksi voit asettaa kelluvan vaakasuoran marginaalin (eli vasemmalle ja oikealle). Tämä voi olla erittäin hyödyllistä, kun joudut asettamaan tietyn leveyden lohkon tarkalleen selainikkunan keskelle. Selain itse määrittää automaattisesti, kuinka suuren sisennyksen tulisi olla molemmilla puolilla, jos kirjoitat seuraavan CSS-käskyn: div {
marginaali: 0 auto;
}
Vaihe 3
Käytä täyteominaisuutta asettaaksesi täyte, joka on etäisyys elementin reunasta kaikkiin sen sisällä oleviin elementteihin, mukaan lukien teksti. Tämän ominaisuuden syntaksi on täsmälleen sama kuin marginaaliominaisuudella: div {
toppaus-top: 10px;
täyte-oikea: 15px;
pehmustepohja: 40px;
pehmuste vasen: 70px;
} Tai div {
täyte: 10px 15px 40px 70px;
}
Vaihe 4
Määritä tekstin sisennysominaisuudella lisä sisennys jokaisen tekstikappaleen ensimmäiselle riville. Esimerkiksi: div {
teksti-luetelmakohta: 80px;
}
Vaihe 5
Käytä HTML img -tunnisteen hspace- ja vspace-määritteitä asettamaan vaakasuora ja pystysuuntainen sisennys kuvasta ulkoisiin elementteihin. Esimerkiksi näin:
Vaihe 6
Käytä taulukotunnisteen cellpadding-määritettä, jos sinun on asetettava sisennys taulukon solujen rajoista niiden sisältöön. Ja solutila-attribuutti asettaa taulukon solujen välisen etäisyyden. Esimerkiksi:
| 1 | 2 |
