伪选择器可以让开发者为组件不同状态定义不同的CSS样式。一个按钮的伪选择器定义如下:
s|Button:over{chromeColor:#0000ff;}
这样定义的作用:鼠标悬停于应用程序中的<s:Button>时,<s:Button>变为蓝色
可以将其中 s|Button 改为普通css类:
.btn:up{chromeColor:#0000ff;}
那么应用该css类的组件如果具备up状态,则在鼠标悬停时变为蓝色
或者使用类选择器的伪选择器:
#btnId:down{chromeColor:#0000ff;}
id为"btnId"的组件如果具备down状态,在鼠标悬停时变为蓝色
另外重要的一点是伪选择器的状态,即“:”后面的over、up、down等等有哪些。可以通过flex的在线文档查到。比如<s:Button>的 Skin States 有四个:up, down, over, disabled 。 那么就可以分别为<s:Button>定义四个状态的伪选择器样式。<s:TextInput>有 disabled 和 normal 两个 Skin States, 所以<s:TextInput>可以定义两个状态伪选择器:s|TextInput:disabled , s|TextInput:normal
分享到:
相关推荐
选择器:CSS3 引入了许多新的选择器,包括属性选择器、伪类选择器和伪元素选择器等。这些选择器可以更精确地选择元素,从而实现更复杂的样式设计。 属性:CSS3 添加了许多新属性,以支持更多的样式效果。例如,可以...
... ## 知识点梳理 - 选择器的权重和优先级 - 盒模型 - 盒子大小计算 - margin 的重叠计算 ...- `flex`布局 ...## 选择器的权重和优先级 CSS 选择器有很多,不同的选择...3. 代表类、伪类和属性选择器,如`.content`、`:ho
├01 css3元素选择器 属性选择器 伪类选择器.mp4 ├02 css3文本选择器 表单选择器 子选择器.mp4 ├03 rgba 字体单位 text-shadow box-shadow.mp4 ├04 盒子尺寸 box-sizing 分栏 background-size linear-gradient ...
选择器:伪类选择器{样式} 伪类分类 1.伪类链接 :link 匹配尚未访问的超级链接状态 :visited 匹配访问过的元素的状态 2.动态伪类 :hover 匹配鼠标悬停在元素上时的状态 :active匹配鼠标激活时元素的状态 ...
css选择器:标签选择器,类选择器,ID选择器,后代选择器,通用选择器,伪类选择器(给html标签的某种状态设置样式),分组选择器; 样式继承,优先级,最高层级!important; css字体样式:font-family设置字体系列...
UI伪类选择器 结构选择器 其他逻辑组合:否定,匹配和父级 基于语言的选择器 链接,位置和用户操作伪类 其他伪类 再谈特异性 第一个字母 第一行 选拔 之前,之后和生成的内容 选拔 其他伪元素 浏览器特定的伪元素 ...
flex-panels :flex-nesting,box-sizing,通用选择器不选择伪元素,使用>选择器,JS classList切换 API搜索:数组方法,字符串方法,正则表达式。 滚动滚动:去抖动,HTMLElement.offsetTop,窗口滚动。 其他...
前端相关知识整理一、 - 标签 - 语义化标签 - 链接标签 - 音视频标签 - svg和canvas - @import和link - meta标签 - ARIA - DTD二、 未更新 - 基础 - 选择器 - 简单选择器 - 组合选择器 - 伪类选择器 - 伪类和伪元素 ...
IRCCloud Layout 实验/演示 尝试重新创建布局并将网站和 Android 应用程序合并为一个的... 展开/折叠菜单完成了正文顶部的复选框和:checked伪选择器。 无障碍,请参阅 技术概览 :负责构建过程的任务运行器 :带有各
JS_basics前端练习 内容为自己的练习题有常见的算法题 以及常考的 Javascript ...重排和重绘★★★15.CSS选择器★★★16.CSS动画★★17.CSS实现三角形★★18.CSS Sprites★★19.pxremem★20.伪类/伪元素★VUE1.
该库由“ CSS3 Flex”,“伪元素和选择器”和“ jQuery 1.x.x”组成。 它已经在所有最新版本的“ IE Edge”,“ IE Explorer> 10”,“ Firefox”,“ Chrome”和“ Opera”浏览器中进行了测试。 rxHTMLButton库v...