用字体在网页中画icon小图标

时间:2023-03-09 04:30:33
用字体在网页中画icon小图标

HTML结构:

<i class="icons icon-ui"> 㐺 <i>
<i class="icons icon-ui"> 㑈 <i>
<i class="icons icon-ui"> 㑉 <i>
<i class="icons icon-ui"> ???? <i>
<i class="icons icon-ui"> ???? <i>
/* here is icons basic style */
.icons{
display:inline-block;*display:inline;*zoom:;
font-style: normal;
} /* you can use css3's @font-face property to set yourself web font */
@font-face{
font-family: mui-global-iconfont;
src:url(fonts/font_icons_ui.eot); /* IE9*/
src:url(fonts/font_icons_ui.eot?#iefix) format('embedded-opentype'), /* IE6-IE8 */
url(fonts/font_icons_ui.woff) format('woff'), /* chrome、firefox */
url(fonts/font_icons_ui.ttf) format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url(fonts/font_icons_ui.svg#iconfont) format('svg') /* iOS 4.1- */
}
.icon-ui{
font-family: mui-global-iconfont !important;
font-size: 22px;
color: #c40000;
}

UI显示: