栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Html/CSS > Bootstrap教程

Bootstrap教程(12)--使用图标

Bootstrap教程(12)--使用图标

1. 背景

大家都晓得,使用图标后,页面效果肯定是好许多的。

一个简单的按钮,添加图标后,有一种传神的效果。精美的图标是要收费的,你享受人家优秀的成果,就得付出相应的价钱。

有一个相当不错的图标库Glyphicon,老外做的,一般情况下咱们要正儿八经的使用,是要收费的。

但是在Bootstrap框架下,使用Glyphicon图标是免费的,就是这么神奇!

2. 使用Glyphicon图标

使用Glyphicon图标很简单,为标签添加相应的样式类即可,例如搜索图标。

class="glyphicon glyphicon-search">

效果如下:

3. 结合按钮使用

图标最常见的使用场景就是结合按钮使用了,可以直接将图标元素放入按钮元素中。示例代码:

			    

效果如下:

4. 小结

Glyphicon提供的图标库还是比较完整全面的,基本够用,需要使用时直接查询下,找到符合需求的样式类然后使用即可。

转载请注明:文章转载自 www.mshxw.com
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号