::first-linePseudo elementas yra taikant stilius pirmoje eilutėje elementą. Įsivaizduokite kelių eilučių ilgą pastraipą (kaip ši!). ::first-lineleidžia suformuoti pirmąją teksto eilutę. Galite naudoti jį, kad padidintumėte arba stilingai pasirinktumėte mažomis dangteliais. Teksto, į kurį nukreiptas šis pseudoelementas, kiekis priklauso nuo kelių veiksnių, tokių kaip eilutės ilgis, peržiūros srities plotis, šrifto dydis, raidžių tarpai, tarpai tarp žodžių. Kai tik eilutė nutrūksta, po jos esantis tekstas nebepasirenkamas. Atkreipkite dėmesį, kad čia nėra pasirinktas tikrasis DOM elementas (taigi „pseudo“ elementas).
Tai pseudo elementas veikia tik blokinių elementų (kai displayyra nustatytas arba block, inline-block, table-caption, table-cell). Jei jis nustatytas tiesiajame elemente, nieko nevyksta, net jei to įdėto elemento linijos pertrauka yra.
Taip pat atkreipkite dėmesį, kad ne visas ypatybes galima naudoti taisyklių rinkinyje, kuriame yra ::first-line. Daugiausia:
.element::first-line ( font-style:… font-variant:… font-weight:… font-size:… font-family:… line-height:… color:… word-spacing:… letter-spacing:… text-decoration:… text-transform:… background-color:… background-image:… background-position:… background-repeat:… background-size:… background-attachment:… )Oficialioje CSS specifikacijoje nurodoma, kad naudotojų agentai gali leisti kitas ypatybes, jei jiems tai patinka:
UA gali taikyti ir kitas savybes.
Žodis, susijęs su specifika
Ši demonstracinė versija parodo, kaip ::first-linesugeba net ir bet kokia specifika !important.
- Pirmasis paraprafas nustatomas pilkai per žymos parinkiklį
- 2 klasės paraprafas nustatomas pilka per klasės parinkiklį
- Trečiasis paraprafas nustatomas pilkai per ID parinkiklį
- Ketvirtasis parafografas yra pilkas per svarbų bashą
Taip yra todėl, kad pseudoelementas traktuojamas kaip vaiko elementas, o ne tik tėvų elemento dalis. Taigi taisyklės, kurias jūs jai taikote, yra būtent jos, tėvų taisyklės gali tik pakylėti.
Be to, pabandykite pakeisti savo naršyklės dydį, kad sužinotumėte, kaip elgtis pseudoelementui, kai keičiasi peržiūros srities plotis.
Nėra: paskutinės eilutės ar: n-osios eilutės, nors tai būtų puiku.
Naršyklės palaikymas
| „Chrome“ | „Safari“ | „Firefox“ | Opera | T.Y | „Android“ | „iOS“ |
|---|---|---|---|---|---|---|
| Taip | Taip | Taip | 3,5+ (senas) 9+ | 5,5+ (senas) 9+ | Taip | Taip |
Kadangi ::first-linetai yra pseudoelementas, prieš jį turėtų būti įrašyti du dvitaškiai, kaip nurodyta CSS2.1. Tačiau kai kurios naršyklės palaiko tik vieno dvitaškio sintaksę („Internet Explorer 5.5–9“ ir „Opera 3.5–9“).