baozi

web font web font icon csse

Transcript

1. Web Font 初步体验
2. 簡介 8FC'POU࠯ඌิ܂ਔᄝຩ်൐Ⴈห൹ሳุ֥ॖିđՖطх૧Ⴈ๭ோ֥ٚمb
   ෱֥ ൌགྷٚم൞๙ݖ$44֥!GPOUGBDFႄೆሳุb
   
   ᄝ!GPOUGBDFຩ઎ሳุ࠯ඌᆭభđᛍফఖཁൕຩ်ഈ໓ሳ൐Ⴈ֥ሳุᆺିཋᇅᄝ ׈ଷ৚ၘࣜνል֥ࠫॻሳุ৚b
   ૄ۱ದ֥׈ଷ৚νል֥ሳุ൞ၹದطၳ֥b!GPOUGBDF֥ቔႨ൞Ֆຩഈ༯ᄛѩ൐ Ⴈሱקၬሳุđ൐်૫ཁൕሳุ҂၇ঠႨ޼֥Ҡቔ༢๤ሳุߌ࣢b
3. 操作系統預裝字體 ⿊黑体：SimHei 宋体：SimSun 新宋体：NSimSun 仿宋：FangSong 楷体：KaiTi 仿宋GB2312：FangSongGB2312 楷体GB2312：KaiTiGB2312 微软雅⿊黑：Microsoft YaHei ......... 冬⻘青⿊黑体: Hiragino Sans GB （SNOW LEOPARD开始提供） 华⽂文细⿊黑：STHeiti Light （⼜又名STXihei） 华⽂文⿊黑体：STHeiti 华⽂文楷体：STKaiti 华⽂文宋体：STSong 华⽂文仿宋：STFangsong .......... Windows操作系统： OS X操作系统：
6. 語法規則 @font-face { font-family: <YourWebFontName>; src: local <source> [<format>][,<source> [<format>]]*; [font-weight: <weight>]; [font-style: <style>]; }
10. 應⽤用場景 CSS3 icon font 字体图标⽣生成 晓凯icon的⽅方案
12. 問題
    ᇅቔაົ޹ӮЧޓۚb్๭َ෫aۚౢ௠ൡ஥َ෫aކѩ࿒е๭۷َ෫đު௹ ྩڿ۷ࡆَ෫b
    
    Ⴈ޼ุဒҵb֝ᇁຩ်҂ᆦӻ࿊ᇏaگᇅaෆ෬aيၲa൏ਈ෪٢đ္߶႕ཙ ൪ᅰႨ޼൐Ⴈ؀௠ఖҠቔຩ်b
    
    ջট۷؟ջॺཨݻb֝ԛ֥๭ோุࠒෛሢ໓Ч૫ࠒᄹࡆđ౏ሳྙ໭مᇗگ০Ⴈđ ᆃཨݻሢնਈ֥ڛༀఖሧჷ
13. 應⽤用場景 font face 中⽂文字体
15. ⼀一⾏行命令，整個⼈人都好了！
17. 其他 淘宝 font:12px/1.5 tahoma,arial,'Hiragino Sans GB’,'\5b8b\4f53',sans-serif 美团 font:400 14px/1.5 "Hiragino Sans GB","WenQuanYi Micro Hei”,tahoma,sans- serif 去哪⼉儿 font:normal 12px/1.5 arial,sans-serif,'Hiragino Sans GB',\5b8b\4f53 為什麼要這麼寫？
18. http://font.baidu.com/editor/ http://www.qianduan.net/css3-icon-font-guide/ http://font-spider.org/ http://www.dafont.com/ http://fortawesome.github.io/Font-Awesome/ https://icomoon.io/#home http://www.qianduan.net/zai-shuo-iconfont-he-font-face/ http://www.cnblogs.com/hustskyking/p/manufacture-font-face-in-web.html http://www.fontsquirrel.com/tools/webfont-generator https://ruby-china.org/topics/14005?page=1 Link:
19. End.