A :dir()CSS álosztálya lehetővé teszi az elemek kiválasztását a nyelv iránya alapján, amint azt a HTML jelölés meghatározza. A dokumentumban valójában csak két nyelv folyhat, amelyek balról jobbra és jobbról balra irányulnak. Gondoljon erre az elemek stílusának módjára, amelyeket megkülönböztet a különböző nyelvi irányultság.
.item:dir(rtl) ( background: red; color: #fff; )Az ál-osztály csak egyetlen értéket fogad el, és null értéket ad vissza, ha egynél több értéket ad meg.
Lásd a Pen: dir pseudo-válogatót Geoff Graham (@geoffgraham) a CodePen-en.
:dir(rtl) vs. (dir=rtl)
Az elemet a nyelvi iránya alapján is kiválaszthatjuk, ha egyezési lekérdezés-választóval használjuk:
.item(dir=rtl) ( background: red; color: #fff; )Ez valóban működik, de különbözik attól :dir(rtl), hogy csak egy elemet választ ki a HTML jelölésben szigorúan meghatározottak szerint. A másik oldalon :dir(rtl)kiszúrja a felhasználói ügynök nyelvi beállításait, és kijelöli az elemet anélkül, hogy azt kifejezetten megadná a HTML-ben.
Ez nagy baj, mert azok az elemek, amelyek nem kifejezetten kimondják a nyelvi irányt, örökölni fogják dirlegközelebbi őse azon tulajdonságát, amely egyet tartalmaz. Ez olyan forgatókönyvhöz vezethet, ahol a használata (dir=rtl)további elemeket választ ki, mint amennyit szándékozik.
Böngésző támogatás
Ez a böngésző támogatási adat a Caniuse cégtől származik, amely részletesebben szerepel. Egy szám azt jelzi, hogy a böngésző támogatja az adott és újabb verziók szolgáltatásait.
Asztal
| Króm | Firefox | AZAZ | Él | Szafari |
|---|---|---|---|---|
| Nem | 17 * | Nem | Nem | Nem |
Mobil / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| Nem | 85 | Nem | Nem |
Több információ
- Válogatók 4. szintű specifikáció
- Króm-szám: 576815
- WebKit hiba # 64861
- Mozilla dokumentáció
- Microsoft Edge Feature Request
- Chromium Platform állapota
- PostCSS
:dir()Polyfill