Elipsa CSS Začátek řetězce

ByDavid Walsh 17. prosince 2018

  • 6

Byl jsem neuvěřitelně šťastný, když CSS text-overflow: ellipsis (ženatý s pevnými width a overflow: hidden byl představen v CSS specifikacích a prohlížečích; tato funkce nám umožnila přestat se snažit spojit výpočet šířky JavaScriptu s výpočtem šířky řetězce a zkrácením. CSS elipsa byla také velmi přátelská k přístupnosti. CSS text-overflow: ellipsis funkce je skvělá, ale v zásadě je určena k elipsizaci řetězců až na konci; co když chceme elipsovat začátek obrazovky? Případ použití je docela rozumný: přemýšlejte o zobrazení cesty k souboru – mnohokrát adresář pro sadu souborů je stejný, v takovém případě byste chtěli zobrazit konec řetězce, ne začátek. Dovolte mi, abych vám na začátku řetězce ukázal trik pro elipsu!

CSS

Zobrazuje elipsu v přední části provázku je mos Totéž jako elipsa na konci, pouze s jedním jednoduchým trikem: Chcete-li přidat elipsu na začátek řetězce, použijte RTL a a text-align k oříznutí začátku řetězce! Přehrávání RTL z text-align je geniální způsob, jak dosáhnout požadovaného efektu elipsy CSS na začátku prvku nebo řetězce. Bylo by skvělé, aby specifikace CSS implementovala robustnější elipsový systém, ale prozatím uctívám úžasné triky CSS, jako je tento!

Write a Comment

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *