使用font swesome图标

来源：互联网发布：竞价排名点击软件编辑：程序博客网时间：2024/05/21 10:42
!DOCTYPE html><html><head>    <title>use font awesome</title></head><body><style>@font-face {  font-family: 'FontAwesome';  src: url('font/fontawesome-webfont.eot?v=4.2.0');  src: url('font/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('font/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('font/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('font/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');  font-weight: normal;  font-style: normal;}body{background-color: #272822;position: absolute;}.main-mesg{position: absolute;top: 20px;left:20px;width: 200px;}a{  text-decoration: none;  color: #742385;  font-size: 25px;  display: block;}.fa {  display: inline-block;  font: normal normal normal 14px/1 FontAwesome;  font-size: inherit;  text-rendering: auto;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}.icon-signal:before {  content: "\f012";}.icon-cog:before{content: "\f013";}.icon-home:before{content: "\f015";}.icon-file:before{content: "\f016";}.icon-download:before{content: "\f01a";}</style><div class="main-mesg"><a href="#"><i class="fa icon-signal"></i><span>signal</span></a><a href="#"><i class="fa icon-cog"></i><span>cog</span></a><a href="#"><i class="fa icon-home"></i><span>home</span></a><a href="#"><i class="fa icon-file"></i><span>file</span></a><a href="#"><i class="fa icon-download"></i><span>download</span></a></div> </body> </html>
阅读全文
0 0