色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css3中新增偽類

錢瀠龍1年前10瀏覽0評論

CSS3是CSS的升級版,它為我們帶來了很多的新特性。在CSS3中,新增了一些非常有用的偽類,下面我們就一一來了解一下吧!

/* :read-only */
:read-only 偽類可以用于匹配只讀的input和textarea元素。當元素為只讀時,它將被應用。在此狀態下,用戶無法修改表單的值。
input:read-only {
background-color: #eee;
}
textarea:read-only {
background-color: #eee;
}
/* :read-write */
:read-write 偽類是與 :read-only 相反的。它用于匹配可編輯的input和textarea元素。如果您想表單元素在不可編輯時有不同的樣式,可以使用 :not(:read-write)。
input:not(:read-write) {
border-color: red;
}
/* :placeholder-shown */
:placeholder-shown 偽類用于匹配 input 或 textarea 元素當中 placeholder 文本處于顯示狀態時的表現。
input[type="text"]:placeholder-shown {
background-color: #fff;
}
/* :valid */
:valid 偽類用于匹配驗證通過的表單元素。可以和屬性選擇器搭配使用。
input[type="email"]:valid {
border: 2px solid green;
}
/* :invalid */
:invalid 偽類用于匹配驗證失敗的表單元素。同樣可以和屬性選擇器搭配使用。
input[type="email"]:invalid {
border: 2px solid red;
}
/* :default */
:default 偽類用于匹配被預設為默認值的表單元素。可以和屬性選擇器搭配使用。
input[type="text"]:default {
background-color: #eee;
}

以上就是CSS3新增的常用偽類,它們能夠有效的增強網頁的可讀性和可用性。在實際開發中,我們可以結合實際需求進行靈活應用。