Sublime编纂器
HTML+CSS方式/
1编写按钮所用的HTML代码， 并为其添加对应的类名， 代码如下所示：
文章插图
2按钮的图标是用字体实现的， 是以我们要利用@font-face引入外部字体， 注重本代码中自界说的字体名称， 具体代码如下所示：
文章插图
3设置按钮的全局样式， 代码如下：
文章插图
4别离为每一个按钮设置零丁的样式， 代码如下所示：
文章插图
5为span标签设置我们在2步设置好的自界说字体名称， 代码如下所示：
文章插图
6【使用CSS字体图标制作漂亮的按钮】利用伪元素为两个span添加内容， 这里申明一下， 分歧的内容会对应分歧的标记和符号， 代码如下图所示：
文章插图
7打开浏览器预览一下吧， 结果是不是很炫？脱手尝尝吧
文章插图
以上内容就是使用CSS字体图标制作漂亮的按钮的内容啦， 希望对你有所帮助哦！
推荐阅读
- 如何使用jQuery变换网页效果
- 前端面试之CSS优先级顺序
- QQ聊天使用变声效果
- 塑料制品使用注意事项
- 或iTunes 解决:此Apple ID尚未在App Store使用
- 怎么使用excel表格快速制作工资条
- 怎样安全使用燃气热水器？
- 使用 Recuva，怎样恢复电脑中被误删除的文件
- 如何使用CAD绘制樱花图案
- creo5.0装配阵列命令怎么使用