:dir()
:dir() CSS 偽類根據元素中文字的方向性來匹配元素。
css
/* Selects any element with right-to-left text */
:dir(rtl) {
background-color: red;
}
:dir() 偽類只使用方向性的語義值,即文件本身定義的值。它不考慮樣式方向性,即透過 CSS 屬性(例如 direction)設定的方向性。
注意:請注意,:dir() 偽類的行為不等同於 [dir=…] 屬性選擇器。後者匹配 HTML dir 屬性,並忽略沒有該屬性的元素——即使它們從父元素繼承了方向。(同樣,[dir=rtl] 和 [dir=ltr] 不會匹配 auto 值。)相反,:dir() 將匹配由使用者代理計算的值,即使是繼承的。
注意:在 HTML 中,方向由 dir 屬性決定。其他文件型別可能有不同的方法。
語法
css
:dir([ltr | rtl]) {
/* ... */
}
引數
:dir() 偽類需要一個引數,表示您想要定位的文字方向性。
示例
HTML
html
<div dir="rtl">
<span>test1</span>
<div dir="ltr">
test2
<div dir="auto">עִבְרִית</div>
</div>
</div>
CSS
css
:dir(ltr) {
background-color: yellow;
}
:dir(rtl) {
background-color: powderblue;
}
結果
規範
| 規範 |
|---|
| HTML # selector-ltr |
| HTML # selector-rtl |
| 選擇器 Level 4 # dir-pseudo |
瀏覽器相容性
載入中…