1

フォントであるアイコンにストローク効果を作成する必要があります。私はテキストシャドウ技術を試しましたが、問題は非常に途切れ途切れになることです。そのため、アウトラインをアイコンから分離し、それをフォントとしてエクスポートしてから、それらを互いにマージすることになりました。

それは今完璧に動作します!... IE ではありません。

私はあなたにすべてを示す以外に私の問題をどれだけうまく説明できるか確信が持てません：カスタムフォントはjsfiddleでは機能しないので、一時的にアップロードしました - http://babysignlanguage.co.za/icon_fonts/

コードは次のとおりです。

CSS:

@font-face {
    font-family: 'icomoon';
    src:url('fonts/icomoon.eot');
    src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
        url('fonts/icomoon.woff') format('woff'),
        url('fonts/icomoon.ttf') format('truetype'),
        url('fonts/icomoon.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}
body {background:#99FFCC;}
.menu_icon_gen {font-size: 6em; font-family: 'icomoon';}
.space { letter-spacing:-2em; zoom:1;}
.left {float:left;}
.green {color:#ACBB72;}
.white {color:#FFF;}

HTML

<div class="menu_icon_gen" aria-hidden="true">
    <span class="green space left">&#xe000;</span> 
    <span class="white">&#xe001;</span>


<div class="menu_icon_gen" aria-hidden="true">
    <span class="green space left">&#xe002;</span> 
    <span class="white">&#xe003;</span>
</div>
4

1 に答える 1

0

私はposition: relativeにdiv、そしてに与えましposition: absoluteたspan。

IE 9で動作します。

ここに画像の説明を入力

于 2013-03-04T06:50:10.717 に答える