网上外贸网站怎么做,网站播放mp3代码,猪八戒官网做网站专业吗,中智项目外包服务有限公司bootstrap字体图标#xff08;Glyphicons#xff09; a.什么是字体图标 字体图标是在 Web 项目中使用的图标字体。虽然#xff0c;Glyphicons Halflings 需要商业许可#xff0c;但是您可以通过基于项目的 Bootstrap 来免费使用这些图标。 b.bootstrap自带字体图标文件结构… bootstrap字体图标Glyphicons a.什么是字体图标 字体图标是在 Web 项目中使用的图标字体。虽然Glyphicons Halflings 需要商业许可但是您可以通过基于项目的 Bootstrap 来免费使用这些图标。 b.bootstrap自带字体图标文件结构 c.css样式中代码如下 font-face {font-family: Glyphicons Halflings;src: url(../fonts/glyphicons-halflings-regular.eot);src: url(../fonts/glyphicons-halflings-regular.eot?#iefix) format(embedded-opentype), url(../fonts/glyphicons-halflings-regular.woff2) format(woff2), url(../fonts/glyphicons-halflings-regular.woff) format(woff), url(../fonts/glyphicons-halflings-regular.ttf) format(truetype), url(../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format(svg);
} .glyphicon {position: relative;top: 1px;display: inline-block;font-family: Glyphicons Halflings;font-style: normal;font-weight: normal;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
} d.用法 如需使用图标只需要简单地使用下面的代码即可。请在图标和文本之间保留适当的空间。 span classglyphicon glyphicon-search/span e.示例代码如下 pbutton typebutton classbtn btn-defaultspan classglyphicon glyphicon-sort-by-attributes/span/buttonbutton typebutton classbtn btn-defaultspan classglyphicon glyphicon-sort-by-attributes-alt/span/buttonbutton typebutton classbtn btn-defaultspan classglyphicon glyphicon-sort-by-order/span/buttonbutton typebutton classbtn btn-defaultspan classglyphicon glyphicon-sort-by-order-alt/span/button
/pbutton typebutton classbtn btn-default btn-lgspan classglyphicon glyphicon-user/span User
/button
button typebutton classbtn btn-default btn-smspan classglyphicon glyphicon-user/span User
/button
button typebutton classbtn btn-default btn-xsspan classglyphicon glyphicon-user/span User
/button f.定制字体尺寸 通过增加或减少图标的字体尺寸您可以让图标看起来更大或更小。 button typebutton classbtn btn-primary btn-lg stylefont-size: 60pxspan classglyphicon glyphicon-user/span demo/button g.定制字体颜色 button typebutton classbtn btn-primary btn-lg stylecolor: rgb(212, 106, 64);span classglyphicon glyphicon-user/span User/button h.应用文本阴影 button typebutton classbtn btn-primary btn-lg styletext-shadow: black 5px 3px 3px;span classglyphicon glyphicon-user/span User/button 效果如下 i.图标列表 参考http://www.shouce.ren/api/view/a/784 j.在线定制字体 http://www.shouce.ren/tool/tubiao 图标列表 转载于:https://www.cnblogs.com/wuheng1991/p/5226607.html
