大佬教程收集整理的这篇文章主要介绍了html – 如何在链接中没有下划线装饰的CSS伪元素的样式?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
在下面的标记中,链接左侧添加了一个“”符号,即鼠标悬停正确的下划线,即使css规则设置为“h3 a:before:hover { text-decoration:none;}“
<style> h3 { display:block; margin:20px auto; padding:6px; width:85%; text-align:left; font: 21px 'lucida sans'; color:#444; border-bottom:#ccc 1px solid; } h3 a{ margin:0; padding:8px 4px 0 0; display:inline; float:right; width:auto; text-decoration:none; font: 14px 'lucida sans'; } h3 a:hover{ text-decoration:underline; } h3 a:before{ content: '+'; margin:0; padding: 4px; } h3 a:hover:before{ text-decoration:none; } </style> <h3>My title <a href="#">link</a></h3>
h3 a:before{ display:inline-block; content: '+'; margin:0; padding: 4px; text-decoration:none; }
以上是大佬教程为你收集整理的html – 如何在链接中没有下划线装饰的CSS伪元素的样式?全部内容,希望文章能够帮你解决html – 如何在链接中没有下划线装饰的CSS伪元素的样式?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。