大佬教程收集整理的这篇文章主要介绍了css3 – 使用Google字体时,Bootstrap图标(Glyphicons)位置稍微上升,我该如何解决这个问题?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
<link href="http://fonts.googleapis.com/css?family=Muli|Dosis:500,400|Open+Sans" rel="stylesheet">
引导图标(Glyphicons)位于稍微上方,您可以在此链接中看到:http://www.acarrilho.com/wp-content/uploads/2012/07/icon_off.png
如何解决这个问题?
[class^="icon-"],[class*=" icon-"] { display: inline-block; width: 14px; height: 14px; margin-top: 1px; *margin-right: .3em; line-height: 14px; vertical-align: text-top; BACkground-image: url("../img/glyphicons-halflings.png"); BACkground-position: 14px 14px; BACkground-repeat: no-repeat; }
在“仪表板”按钮中,字体大小似乎大于14px,也许是22px?一个解决方案可能是为您的按钮创建替代/扩展选择器,并将垂直对齐方式更改为基线:
[class^="icon-"] .my-class,[class*=" icon-"] .my-class { vertical-align: baseline; }
但请记住,视觉中心依赖于这个词; “仪表板”例如没有下降(见更多约the anatomy of typography).如果基线看起来不太好尝试其他一些,见specification here.
@ user1751766的建议解决方案也是可行的.但是我建议.my类从Bootstrap的默认声明中对这个替代声明进行定义.
以上是大佬教程为你收集整理的css3 – 使用Google字体时,Bootstrap图标(Glyphicons)位置稍微上升,我该如何解决这个问题?全部内容,希望文章能够帮你解决css3 – 使用Google字体时,Bootstrap图标(Glyphicons)位置稍微上升,我该如何解决这个问题?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。