<a>标签伪类书写顺序为什么是lvha
2013-09-17 12:57
218 查看
a标签伪类的作用:
":link": a标签还未被访问的状态;
":visited": a标签已被访问过的状态;
":hover": 鼠标悬停在a标签上的状态;
":active": a标签被鼠标按着时的状态;
写样式时,为毛要按这个顺序写:
其实本质还是“同等优先权的样式,写在后边的会覆盖前边”,a标签的伪类只不过是又结合了不同的动作顺序,动作的触发顺序决定了伪类的顺序必须按lvha来写。
下面结合这4个伪类简单说下:
因为前2者两种状态是常态,而后2者是即时状态,当即时状态触发时,要覆盖常态,所以2个即时状态要放在后边;
因为在常态下:如果a标签被访问过后,就要呈现被访问过的状态,所以visited 要放在link后边;
因为鼠标按下时,伴随着悬停的a标签上,所以要想active覆盖hover,就必须把active放后边;
顺序记忆技巧:
lv包hao用
":link": a标签还未被访问的状态;
":visited": a标签已被访问过的状态;
":hover": 鼠标悬停在a标签上的状态;
":active": a标签被鼠标按着时的状态;
写样式时,为毛要按这个顺序写:
其实本质还是“同等优先权的样式,写在后边的会覆盖前边”,a标签的伪类只不过是又结合了不同的动作顺序,动作的触发顺序决定了伪类的顺序必须按lvha来写。
下面结合这4个伪类简单说下:
因为前2者两种状态是常态,而后2者是即时状态,当即时状态触发时,要覆盖常态,所以2个即时状态要放在后边;
因为在常态下:如果a标签被访问过后,就要呈现被访问过的状态,所以visited 要放在link后边;
因为鼠标按下时,伴随着悬停的a标签上,所以要想active覆盖hover,就必须把active放后边;
顺序记忆技巧:
lv包hao用
相关文章推荐
- <a>链接四个伪类书写顺序的真正原因
- <a>标签的四个伪类元素
- a标签伪类的作用及书写顺序是什么
- <a>标签伪类的顺序
- <a>链接的四个伪类顺序
- 为什么Thinkphp 中的<if><volist>等标签不能用
- <a>标签href属性和onclick()执行顺序及点击两次才跳转
- <a>标签href与js(onclick)的触发顺序
- a标签的各个伪类书写顺序
- <global-forwards>标签
- HTML中的<pre>标签
- <fmt:formatNumber>标签
- 前端js过滤html标签和<>、空格等产生的特殊符合
- HTML中的<video>标签的格式和其中的属性的用法
- 刨根问底,你知道:hover等4个伪类为什么要按顺序排列吗
- 为什么canvas宽高要设置在标签内>>宽高设置在style和设置在canvas的区别
- js——<script>标签的加载顺序
- 关于PHP CodeIgniter框架中通过<a>标签和url做多条件分类筛选
- <span>标签元素内容换行问题
- <meta>标签的使用