大佬教程收集整理的这篇文章主要介绍了css – 具有三角形的工具提示,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
a.tip { position: relative; } a.tip span { display: none; position: absolute; top: -5px; left: 60px; width: 125px; padding: 5px; z-index: 100; BACkground: #000; color: #fff; -moz-border-radius: 5px; /* this works only in camino/firefox */ -webkit-border-radius: 5px; /* this is just for Safari */ } a:hover.tip { font-size: 99%; /* this is just for IE */ } a:hover.tip span { display: block; }
<center><a href="http://google.com/" class="tip">Link!<span>Hi its me!</span></a></center>
基本上我在我的网站上有一个工具提示,它显示在我的链接的右边.但是在黑匣子的左手边,我想要一个三角形附在指向链接的框上,是否可以使用CSS?就像这样,但在左边
a.tip span:before{ content:''; display:block; width:0; height:0; position:absolute; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right:8px solid black; left:-8px; top:7px; }
以上是大佬教程为你收集整理的css – 具有三角形的工具提示全部内容,希望文章能够帮你解决css – 具有三角形的工具提示所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。