在 style 里面可以用 a:link、a:hover、a:active、a:focus、a:visited 改变超连结的样式。
而 CSS 样式後面写的会盖掉前面的关系,需按照以下顺序由上而下来写,超连结才不会坏掉:
:link > :visited > :focus > :hover > :active
因为鼠标在外时,要能显示 :link 跟 :visited 的状态。
其中 :visited 要能盖过 :link 才能显示出被点击後的外观。
所以 :link 要放在 :visited 前面,其他三个则要放在他们後面才不会被盖住。
再来鼠标移过去点击後拉开放掉会呈现 :focus,此时鼠标移过去时应该要能呈现 :hover,
所以 :focus 要放在 :hover 前面。
接着同为鼠标移过去的状态,:hover 会先出来,:active 需要比 :hover 优先被执行,
所以 :hover 要放在 :active 前面。
<body>
<a href="#">我是超连结</a>
</body>
<style>
a:link {
color: orange;
}
a:visited {
color: indigo;
}
a:focus {
background: grey;
}
a:hover {
color: black;
}
a:active {
color: green;
}
</style>
参考资料:
[1]MDN:虚拟类别(pseudo-class)
[2]常用於超连结的动态僞类选取器 - 让你网页互动变丰富
>>: Youtube API - 简介与建立 Google Cloud Platform 专案
hi~今天要延续昨天merkle tree的主题! 我们昨天简述完之後,有用图解,希望大家有更清楚...
大部分的处理器都有以下四种例外的类型,优先权由高至低排列: 1.非同步不可遮罩 2.同步精确 3.同...
Publisher 在Combine 中,Publisher 是观察者模式中的Observable,...
完成的页面也不少了,距离完赛剩3天,就不刻画面了,先来串串api啦! 刚好可以把之前假资料的部分全部...
我认为整个 Scrum 架构中,对系统以及最终的自组织目标,最重要、最有价值的一场活动,就是检讨会议...