block-overflowNuosavybė nukerta tekstą ir rodo daugiau turinio taip įterpiant elipsės arba pasirinktinį eilutę po eilutes, kurios yra nustatytos pagal numerį max-linesturtą.
Nuosavybė buvo pristatyta 3 lygio CSS perpildymo modulio redaktoriaus projekte. Tai reiškia, kad šiuo metu jis yra eksperimentinis ir laikomas vykdomu darbu. Tiesą sakant, galite sekti pokalbį, kuris apima pokalbius apie viso turto pervadinimą.
Sintaksė
.module ( block-overflow: (clip | ellipsis | ); max-lines: (); /* required by block-overflow */ )block-overflow priima šias vertes:
clip: Neįterpia simbolio, kad nurodytų daugiau sekamo teksto. Vietoj to, turinys yra tiesiog sutrumpinamas ir nutraukiamas paskutiniame simbolyje.ellipsis: Paskutinės eilutės pabaigoje rodo elipsę (…). Jis turėtų būti pateiktas kaip „Unicode“ simbolis (U + 2026), tačiau jį būtų galima pakeisti ekvivalentu, atsižvelgiant į naudojamo „User-Agent“ turinio kalbą ir rašymo režimą.: Paskutinės eilutės pabaigoje rodo pasirinktinį tekstą (pvz., „Skaityti daugiau →“). Specifikacija sako, kad „User-Agent“ gali pakeisti eilutę elipsės forma, jei eilutė yra „absurdiškai“ ilga.
Vėlgi, visa tai yra eksperimentinis, nebaigtas darbas. Šios vertės gali pasikeisti. Arba galima būtų pridėti dar daugiau. Pavyzdžiui, buvo raginama sukurti „protingesnę“ elipsę, kuri galėtų atlikti daugiau dalykų, pavyzdžiui, apkarpyti tekstą viduryje:
One thing led to another and… yada yada yada, that was that.Naudokite line-clamptrumpai
Mes galime gauti beveik tą patį dalyką, naudojant tai, line-clampkas yra block-overflowir max-linessavybių sutrumpinimas .
Kaip tai šiuo metu apibrėžta, nors line-clamppriima tik vieną skaitinę vertę max-linesir netiesiogiai nustato block-overflowsu ellipsisverte. Taigi, jei norite naudoti sutrumpintą eilutę, tada turėsite naudoti ilgąją formą.
Naršyklės palaikymas
Šiuo metu nėra, bet galite gauti tam tikrą palaikymą naudodamiesi „WebKit“ patentuotu įgyvendinimu line-clamp:
Šie naršyklės palaikymo duomenys yra iš „Caniuse“, kuri turi daugiau informacijos. Skaičius rodo, kad naršyklė palaiko šios ir naujesnės versijos funkciją.
Darbalaukis
| „Chrome“ | „Firefox“ | T.Y | Briauna | „Safari“ |
|---|---|---|---|---|
| 14 * | 68 * | Ne | 17 | 5 * |
Mobilusis / planšetinis kompiuteris
| „Android Chrome“ | „Android Firefox“ | „Android“ | „iOS Safari“ |
|---|---|---|---|
| 88 * | 85 * | 2,3 * | 5,0–5,1 * |