CSS text-overflow eigenschap

Definitie en gebruik

De text-overflow-eigenschap bepaalt wat er gebeurt wanneer de tekst over de inhoudselementen uitloopt.

Zie ook:

CSS3 handleiding:CSS3 teksteffecten

HTML DOM referentiehandleiding:textOverflow-eigenschap

Voorbeeld

Gebruik van de text-overflow-eigenschap:

div.test
{
text-overflow:ellipsis;
}

Probeer het zelf uit

Er zijn meer voorbeelden onderin de pagina.

CSS-syntaxis

text-overflow: clip|ellipsis|string;

Eigenschapswaarde

Waarde Beschrijving Test
clip Knip tekst af. Test
ellipsis Toon een ellips om de afgekorte tekst te vertegenwoordigen. Test
string Gebruik de gegeven string om de afgekorte tekst te vertegenwoordigen.

Technische details

Standaardwaarde: clip
Inheritance: nee
Versie: CSS3
JavaScript-syntaxis: object.style.textOverflow="ellipsis"

Meer voorbeelden

Text-overflow met hover-effect
Dit voorbeeld demonstreert hoe de volledige tekst wordt weergegeven wanneer de cursor over het element zweeft.

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die deze eigenschap volledig ondersteunt.

Getallen met -o- als prefix geven de eerste versie aan.

Chrome IE / Edge Firefox Safari Opera
4.0 6.0 7.0 3.1 11.0
9.0 -o-