4.1 UI元素状态伪类选择器

一、UI元素状态伪类选择器

UI元素状态伪类选择器,额,这个术语真专业……

坑爹的术语,往往都是吓唬人的。其实,UI元素状态伪类选择器指的是“UI元素状态”这方面的伪类选择器,很简单。UI,是用户界面(User Interface)的意思。所谓的UI设计是指对软件的人机交互、操作逻辑、界面美观的综合设计。

UI元素状态包括:可用、不可用、选中、未选中、获取焦点、失去焦点等。

这些选择器的共同特征是:指定的样式只有当元素处于某种状态下时才起作用,在默认状态下不起作用。UI元素状态伪类选择器大多数都是针对表单元素来使用的。

这里,我们仅仅是讲解CSS3新增的UI元素状态伪类选择器。

CSS3 UI元素状态伪类选择器
选择器 说明
E:focus 指定元素获得光标焦点时使用的样式
E:checked 选择E元素中所有被选中的元素
E::selection 改变E元素中被选择的网页文本的显示效果
E:enabled 选择E元素中所有“可用”元素
E:disabled 选择E元素中所有“不可用”元素
E:read-write 选择E元素中所有“可读写”元素
E:read-only 选择E元素中所有“只读”元素
E::before 在E元素之前插入内容
E::after 在E元素之后插入内容

在接下来的课程中,我们一一详细地为大家讲解这些UI元素状态伪类选择器。

:本站所有教程均为原创,大部分已经与人民邮电出版社合作出版,禁止转载和抄袭,否则绿叶学习网和人民邮电出版社必将追究法律责任,附录:互联网著作权保护法。【法律顾问:张俊律师】

如果你想要获取更多学习资料,或者在学习过程中遇到疑问想要得到跟教程一样最优质的解答,请通过以下方式关注我们:

(1)官方微博:

(2)新手Q群:69660533(暗号:lvye)(建议初学前端的加)

(3)官方Q群:457631216(暗号:lvye)(建议有JS基础的加)

(4)绿叶论坛:进入论坛

(5)常见问题:绿叶学习网常见问题解答

回到顶部