一、FontAwesome测试
以font-awesome-4.3.0版本为例测试。
1、直接在html页面打出链接图标&＃xff1a;
- <!DOCTYPE html>
- <head>
- <link href&＃61;"font-awesome-4.3.0/css/font-awesome.min.css" rel&＃61;"stylesheet">
- <span><i class&＃61;"fa fa-link"></i>链接</span>
- </head>
- </html>
如果是IE7,使用font-awesome-ie7.min.css&＃xff1a;
注意&＃xff0c;引用时要在“fa-link”前面还要加入一个“fa”类&＃xff0c;例如 &＃xff01;
2、设置颜色与大小
- <!DOCTYPE html>
- <head>
- <link href&＃61;"font-awesome-4.3.0/css/font-awesome.min.css" rel&＃61;"stylesheet">
- <br />
- <span style&＃61;"font-size:12px;"><i class&＃61;"fa fa-link"></i>链接</span>
- <br />
- <span style&＃61;"fon-size:20px;"><i class&＃61;"fa fa-link"></i>链接</span>
- <br />
- <span style&＃61;"color:red"><i class&＃61;"fa fa-link"></i>链接</span>
- <br />
- <span style&＃61;"color:white;background-color:#003399;"><i class&＃61;"fa fa-link"></i>链接</span>
- </head>
- </html>
font-awesome-4.3.0工具上传&＃xff1a;
font-awesome-4.zip
二、FontAwesome工程应用
在Views->Shared->_Layout.cshtml中添加引用&＃xff1a;
- <link href&＃61;"&＃64;Url.StaticFile("/assets/font-awesome/css/font-awesome.css")" rel&＃61;"stylesheet" />
在其它文件直接调用&＃xff1a;
运行效果&＃xff1a;
参考文献&＃xff1a;
http://www.cnblogs.com/wangfupeng1988/p/4129500.html
京公网安备 11010802041100号