<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>字体图标应用</title>
<style>
@font-face {
font-family: 'FontAwesome';
src: url("css/fonts/fontawesome-webfont.eot");
src: url("css/fonts/fontawesome-webfont.eot") format("embedded-opentype"), url("css/fonts/fontawesome-webfont.woff2") format("woff2"), url("css/fonts/fontawesome-webfont.woff") format("woff"), url("css/fonts/fontawesome-webfont.ttf") formoat("truetype"), url("css/fonts/fontawesome-webfont.svg") format("svg");
font-weight: normal;
font-style: normal;
}
/*设置字体编码*/
.fa-weixin:before {
content: "\f1d7";
}
.fa {
color: green;
font: normal normal 5em FontAwesome;
/*优化字体渲染效果:抗锯齿技术，使字体更加平滑清晰（默认值）*/
-webkit-font-smoothing: antialiased;
/*优化字体渲染效果:次像素抗锯齿技术，进一步提高字体显示效果，但可能会出现颜色参差不齐的问题*/
/*-webkit-font-smoothing:subpixel-antialiased;*/
}
</style>
</head>
<body>
<i class="fa fa-weixin"></i>
<h5>微信公共平台开发</h5>
</body>
</html>
响应式Web开发项目教程（HTML5+CSS3+Bootstrap）第2版 例2-4 字体图标应用
需积分: 0 124 浏览量
2024-01-12
23:14:22
上传
评论
收藏 609KB ZIP 举报
例2-4.zip （7个子文件） 
例2-4 
demo4.html 1KB css fonts 
FontAwesome.otf 132KB fontawesome-webfont.eot 162KB fontawesome-webfont.woff 96KB fontawesome-webfont.woff2 75KB
fontawesome-webfont.svg 434KB fontawesome-webfont.ttf 162KB资源评论
