下面是编程之家 jb51.cc 通过网络收集整理的代码片段。编程之家小编现在分享给大家,也给大家做个参考。
站长闲下来的时候,就四处逛逛网站,顺便扒点其他网站的代码,比如 html、css、js;都是站长通过 f12 或者 view-source 扒到的,有些代码很容易就能扒到,有些很难,比如今天分享的这个,扒了得半小时,才找到 css 具体代码!支持所有网站,wordpress、typecho、hexo 等等之类的。
代码说明:
该 css 代码,作用于 class 为 post-item 下 h2 标签下的 a 标签,当鼠标滑过,即:hover 时,指定了半径为 20px 的边框,背景色为#6f9fc7,字体颜色为#fff,执行 links 动作,后面的参数为时间;@-webkit-keyframes 规定了 links 执行的具体动作;可以参看参考本站首页的文章标题,鼠标滑过特效!如果你想给自己网站某元素加入这种特效,只需替换.post-item h2 a 为锁需要特效的元素即可,下面展示了本文 css 的特效!!!
CSS 代码:
.post-item h2 a:hover {
border-radius: 20px;
background: #6f9fc7;
color: #fff;
-webkit-animation: links .2s 2
}
@-webkit-keyframes links {
0% {
-webkit-transform: rotate(-2deg)
}
100% {
-webkit-transform: rotate(2deg)
}
}
以上是编程之家(jb51.cc)为你收集整理的全部代码内容,希望文章能够帮你解决所遇到的程序开发问题。如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。