使用css 实现鼠标事件响应动态下划线（动态过渡） |
您所在的位置：网站首页 › html文本下划线标签 › 使用css 实现鼠标事件响应动态下划线（动态过渡） |
使用css 实现鼠标事件响应动态下划线（动态过渡）
|
最后显示效果： HTML代码： Home About Solutions SignIn #underline a{ //去除A标签原来的下滑线 text-decoration:none; } #underline{ margin: 24px; position: relative; float: left; } //这里涉及到css的伪类和伪元素的使用 //:after是一个伪元素，是在 |
描述：鼠标滑动至Home上，触发css事件（hover、after）home的下滑线会由中间到两边呈动态效果慢慢出现 原理：给A标签外加一个div盒子，当触发div标签的时候，盒子的css样式会改变，边框会以动态形式呈现【本文地址】
今日新闻 |
推荐新闻 |