Meestal worden de mogelijkheden van de CSS-taal (Cascading Style Sheets) gebruikt om de grootte van inspringingen in HTML-pagina's te specificeren. Hoewel er in de HTML-taal zelf verschillende "rudimentaire" overblijfselen zijn, die in sommige gevallen inspringen mogelijk maken. Hieronder staan de opties die het meest worden gebruikt, maar daarnaast zijn er nog heel wat verschillende soorten trucs waarmee je inspringingen kunt instellen voor niet-standaard opmaak van HTML-documenten.
Het is nodig
Basiskennis van HTML- en CSS-talen
instructies:
Stap 1
Bepaal het pagina-element waaruit u wilt inspringen. Als de tekst bijvoorbeeld binnen de tag … (blok) wordt geplaatst, dan is dit blok het bovenliggende element voor deze tekst en moet de inspringing worden geteld vanaf de randen van het blok. En als de tekst (of afbeelding) zich niet in een blok (div, li, etc.) of inline (span, p, etc.) elementen bevindt, dan is de ouder de hoofdtekst van het document (body tag). Het definiëren van een bovenliggend element voor de tekst is noodzakelijk omdat hij het is die de beschrijvingen moet instellen van de stijlen die de inspringingen vormen. Laten we aannemen dat uw tekst in een div-blok is geplaatst: Voorbeeldtekst
Stap 2
Gebruik de CSS-taaleigenschap marge om marges in te stellen, dat wil zeggen de afstand van de randen van een element tot aangrenzende elementen, evenals tot de randen van het bovenliggende element. Deze afstand kan afzonderlijk worden ingesteld voor de opvulling aan elke kant: marge-boven - boven, marge-rechts - rechts, marge-onder - onderaan, marge-links - links. Voor het bovenstaande voorbeeld kan deze css-code er als volgt uitzien: div {
marge-top: 10px;
marge-rechts: 15px;
marge-onder: 40px;
marge-links: 70px;
} Hier is "div" een selector die specificeert dat deze stijl moet worden toegepast op alle div's in de documentcode. Met de CSS-syntaxis kunt u alle vier de regels in één combineren: div {
marge: 10px 15px 40px 70px;
} De waarden van de inspringingen moeten altijd in deze volgorde worden opgegeven: eerst - bovenaan, dan - rechts, onderaan en links. Als de inspringingen aan alle kanten hetzelfde zijn, volstaat het om de waarde op te geven een keer: div {
marge: 70px;
} Daarnaast kunt u een zwevende horizontale marge instellen (dat wil zeggen, links en rechts). Dit kan erg handig zijn wanneer u een blok van een bepaalde breedte precies in het midden van het browservenster moet plaatsen. De browser bepaalt zelf automatisch hoeveel inspringing er aan beide kanten moet zijn, als je het volgende CSS-statement schrijft: div {
marge: 0 automatisch;
}
Stap 3
Gebruik de eigenschap opvulling om opvulling in te stellen, wat de afstand is van de rand van een element tot alle elementen die erin zijn geplaatst, inclusief tekst. De syntaxis voor deze eigenschap is precies hetzelfde als voor de eigenschap marge: div {
opvulling-top: 10px;
opvulling-rechts: 15px;
opvulling-bodem: 40px;
opvulling-links: 70px;
} Of div {
opvulling: 10px 15px 40px 70px;
}
Stap 4
Gebruik de eigenschap text-indent om de extra inspringing voor de eerste regel van elke alinea met tekst in te stellen. Bijvoorbeeld: div {
tekst-inspringing: 80px;
}
Stap 5
Gebruik de kenmerken hspace en vspace van de HTML img-tag om respectievelijk de horizontale en verticale inspringing van de afbeelding naar de buitenste elementen in te stellen. Bijvoorbeeld als volgt:
Stap 6
Gebruik het kenmerk cellpadding van de tabeltag als u de inspringing van de randen van cellen in de tabel naar hun inhoud wilt instellen. En het cellpacing-attribuut bepaalt de afstand tussen tabelcellen. Bijvoorbeeld:
| 1 | 2 |
