大佬教程收集整理的这篇文章主要介绍了css – 如何在DIV悬停上显示图像/链接?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
.comment .button { visibility: hidden; } .comment:hover .button { visibility: visible; }
<div class="comment"> <a ...><img class="vote button" ...></a> <a ...><img class="flag button" ...></a> <a ...><img class="delete button" ...></a> <span class="comment-text">...</span> </div>
Andrew指出,这个纯CSS解决方案在IE6中不起作用.而正如Noel指出的那样,悬停在移动浏览器中不是一个选择.在这些情况下,您可以使用渐进增强功能使按钮始终可见.
<style type="text/css" media="screen"> .comment .button { visibility: hidden; } .comment:hover .button { visibility: visible; } </style> <!--[if lt IE 7]> <style type="text/css"> .comment .button { visibility: visible; } </style> <![endif]-->
IE6将了解第一个样式,使按钮隐藏,但不是第二个,使其在悬停时再次可见.第三款是conditional comment,非IE浏览器和IE7将忽略.它覆盖第一个样式,使按钮始终可见.
以上是大佬教程为你收集整理的css – 如何在DIV悬停上显示图像/链接?全部内容,希望文章能够帮你解决css – 如何在DIV悬停上显示图像/链接?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。