网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。
在工作中为了使页面有动感,前端开发人员经常会在页面中加上鼠标经过和鼠标移出的效果,使页面更具有吸引力。这篇文章就和大家讲讲
CSS中的hover事件,
CSS:hover怎么使用,以及用代码说明怎么用CSS:hover变色。需要的小伙伴,继续往下看吧。
细心的小伙伴会发现,几乎每个网站都会用到hover,hover一般被应用在按钮、logo以及图片等元素上面,但有些时候也会用到mouseover和mouseout这两个鼠标事件,但是JavaScript比较麻烦,建议能用CSS解决的尽量用CSS吧,这样可以提高性能。接下来就详细讲讲hover的使用方法。
一、定义和用法
定义:hover在鼠标移到链接上时可以添加特殊样式。
用法:选择器:hover{属性:属性值}
比如:
a:hover{background-color:yellow;}
.aa:hover{color:#FFF;background:#0C0;}
与hover相关的伪类:
:hover 选择器可用于所有元素,不仅是链接。
:link 选择器设置了未访问过的页面链接样式,
:visited 选择器设置访问过的页面链接的样式
:active选择器设置当你点击链接时的样式
注意:为了产生预期的效果,:hover 必须位于 :link 和 :visited 之后。
二、CSS:hover方法实例
实例描述:当鼠标进过div时,这个div逐渐变大,当鼠标移出时,div又逐渐变小,回到最初的样式。这个就是使用的CSS hover事件实现的。
HTML部分:
<div class="aa"></div>