• :在线测试工具暂时不可用,小伙伴们可以使用本地编辑器来代替,绿叶全新版本正在快马加鞭开发中,比心~

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元素状态伪类选择器。

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

小伙伴们也可以加一下QQ群,在“群文件”中可以获取学习资源以及配套资源,以及跟其他小伙伴交流,站长也在群内。

(1)QQ群:519225291(暗号:lvye

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

回到顶部