添加博客字体Noto Sans CJK

因为特别喜欢思源黑体,前天就开始着手修改了,之前没有经验,所以查阅了大量的资料,typekit下载到的这个Normal版本也不是非常满意,先用段时间看看效果吧,字体格式转换用到了字蛛的相关思路——即是把常用汉字及字符汇总到了一个html里,然后按照步骤进行了压缩:

C:\Users\412jht>font-spider K:/系统iso/ceshi/index.html
Font family: Noto Sans CJK SC
Original size: 7975.766 KB
Include chars: #$%&*+-./;<=>?@K\_abcdefghijklmnopqrstuwxyz{}~¡¢£¤¥§¨©«®¯°±²
³´¶¸¹º»½¾¿×ØÜàáèéêìíòó÷øùúüāčēěīłńňōūƒǎǐǒǔǖǘǚǜɑɡˆˇˉ˜ΑΒΓΔΕΖΗΘΙΚΛΜ
ΝΞΟΠΡΣΤΥΦΧΨΩαβγδεζηθικλμνξοπρστυφχψωϟϡЁАБ
ВГДЕЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдежзий
клмнопрстуфхцчшщъыьэюяёҰت۰۵ރर฿ღ‐—―‖‘’“”†‡•…‰‱′
″‹›※‿₠₡₢₣₤₥₦₧₨₩₪₫€₭₮₯₰₱₲₳₴₵₸₹ℂ℃℅℉ℊℋℌℍℎℐℑℒℓℕ№℗℘ℙℚℛℜℝ℠™ℤℨℬℭ℮ℯℰℱℳℴ⅓⅔⅕⅖⅗⅘⅙⅚⅛⅜⅝
⅞⅟ⅠⅡⅢⅣⅤⅥⅦⅧⅨⅩⅪⅫⅬⅭⅮⅯⅰⅱⅲⅳⅴⅵⅶⅷⅸⅹⅺⅻⅼⅽⅾⅿ←↑→↓↔∑√∝∞∟∠∥∧∨∩∪∫∬∭∮∯∰∱∲∳∴∵∶∷∽≂≃≄≅≆≇≈≉≊≋≌≍≎≏≐≑≒≓≔≕≖≗≘≙≚≛≜≝≞≟≠≡
≢≣≤≥≦≧≨≩≮≯⊕⊗⊙⊥⊰⊱⊿⋆⋚⋛⌒⌘⏎①②③④⑤⑥⑦⑧⑨⑩⑪⑫⑬⑭⑮⑯⑰⑱⑲⑳⑴⑵⑶⑷⑸⑹⑺⑻
⑼⑽⑾⑿⒀⒁⒂⒃⒄⒅⒆⒇⒈⒉⒊⒋⒌⒍⒎⒏⒐⒑⒒⒓⒔⒕⒖⒗⒘⒙⒚⒛⒜⒝⒞⒟⒠⒡⒢⒣⒤⒥⒦⒧⒨⒩⒪⒫
⒬⒭⒮⒯⒰⒱⒲⒳⒴⒵ⒶⒷⒸⒹⒺⒻⒼⒽⒾⒿⓀⓁ┄┅┆┇┈┉┊┋┌┍┎┏┐┑┒┓└┕┖┗┘┙┚┛├┝┞┟┠┡┢┣┤┥┦┧┨┩┪
┫┬┭┮┯┰┱┲┳┴┵┶┷┸┹┺┻┼┽┾┿╀╁╂╃╄╅╆╇╈╉╊╋╌╍╎╏═║╒╓╔
╕╖╗╘╙╚╛╜╝╞╟╠╡╢╣╤╥╦╧╨╩╪╫╬╭╮╯╰╳▀▁▂▃▄▅▆▇█▉▊
▋▌▍▎▏▐░▒▓▔▕■□▢▣▤▥▦▧▨▩◕◖◗◘◙◢◣◤◥◦✷✸✹✺✻✼✽✾✿❀❁❂❃➦➧➨➩➪➫➬➭➮➯➱➲➳➴➵➶➷➸➹➺➻➼➽➾、。〃々〆〈〉《》「」『』【】〒〓〔〕〖〗〝〞〡〢〣〤〥
〦〧〨〩ぁあぃいぅうぇえぉおかがきぎくぐけげこごさざしじすずせぜそぞただちぢっつ
づてでとどなにぬねのはばぱひびぴふぶぷへべぺほぼぽまみむめもゃやゅゆょよらりるれ
ろゎわゐゑをんゔゕゖ゠ァアィイゥウェエォオカガキギクグケゲコゴサザシジスズセゼソゾ
タダチヂッツヅテデトドナニヌネノハバパヒビピフブプヘベペホボポマミムメモャヤュユ
ョヨラリルレロヮワヰヱヲンヴヵヶヷヸヹヺ・ーヽヾヿㄅㄆㄇㄈㄉㄊㄋㄌㄍㄎㄏㄐㄑㄒㄓㄔㄕㄖ
ㄗㄘㄙㄚㄛㄜㄝㄞㄟㄠㄡㄢㄣㄤㄥㄦㄧㄨㄩㇰㇱㇲㇳㇴㇵㇶㇷㇸㇹㇺㇻㇼㇽㇾㇿ㈠㈡㈢㈣㈤㈥㈦㈧㈨㈩㉿㊀㊁㊂㊃㊄
㊅㊆㊇㊈㊉㊊㊋㊌㊍㊎㊏㊐㊑㊒㊓㊔㊕㊖㊚㊛㊜㊝㊞㊟㊠㊡㊢㊣㊤㊥㊦㊧㊨㊩㊪㊫㊬㊭㊮㊯㊰㋀㋁㋂㋃㋄㋅㋆㋇㋈㋉㋊㋋㍘㍙㍚㍛㍜㍝㍞㍟㍠㍡㍢㍣㍤㍥㍦㍧㍨㍩㍪㍫㍬㍭㍮
㍯㍰㍿㎎㎏㎜㎝㎞㎡㏄㏎㏑㏒㏕㏠㏡㏢㏣㏤㏥㏦㏧㏨㏩㏪㏫㏬㏭㏮㏯㏰㏱㏲㏳㏴㏵㏶㏷㏸㏹㏺㏻㏼㏽㏾一丁七万丈三上下不与丐丑
猻猼猽猾猿獀獁獂獃獄獅獆獇獈獉獊獋獌獍獎獏獐獑獒獓獔獕獖獗獘獙獚獛獜獝獞獟獠獡獢
獣獤獥獦獧獨獩獪獫獬獭獮獯獰獱獲獳獴獵獶獷獸獹獺獻獼獽獾獿玀玁玂玃玄玅玆率玈玉玊
王玌玍玎玏玐玑玒玓玔玕玖玗玘玙玚玛玜玝玞玟玠玡玢玣玤玥玦玧玨玩玪玫玬玭玮环现玱玲
玳玴玵玶玷玸玹玺玻玼玽玾玿珀珁珂珃珄珅珆珇珈珉珊珋珌珍珎珏珐珑珒珓珔珕珖珗珘珙珚
珛珜珝珞珟珠珡珢珣珤…………大量汉字省略………齏齐齑齒齓齔齕齖齗齘齙齚齛齜齝齞齟
齠齡齢齣齤齥齦齧齨齩齪齫齬齭齮齯齰齱齲齳齴齵齶齷齸齹齺齻齼齽齾齿龀龁龂龃龄龅龆龇
龈龉龊龋龌龍龎龏龐龑龒龓龔龕龖龗龘龙龚龛龜龝龞龟龠龡龢龣龤龥웃유큐ﭢ﷼︰︴︵︶︷
︸︹︺︻︼︽︾︿﹀﹁﹂﹃﹄﹉﹊﹋﹌﹍﹎﹏﹑﹔﹕﹖﹛﹜﹟﹠﹡﹢﹣﹤﹥﹦﹨﹩﹪﹫!"
$%'(),:;?@[]_`|~。¢£ ̄¥
Chars length: 22508
Font id: 182d9e7987ff297601f31fa84d98500a
CSS selectors: 
Font files:
File k:\系统iso\ceshi\font\Noto Sans CJK SC.eot created: 5739.488 KB
File k:\系统iso\ceshi\font\Noto Sans CJK SC.woff created: 5739.244 KB
File k:\系统iso\ceshi\font\Noto Sans CJK SC.ttf created: 5739.172 KB
File k:\系统iso\ceshi\font\Noto Sans CJK SC.svg created: 16305.422 KB

上传到实例后又发现了之前本地的路径问题,一开始还在想到底支不支持相对路径(绝对路径直接写全网址当然也可以,但是总感觉不太好,后期如果调整还要浪费时间),最后经过摸索实现了下面这种写法:

@font-face {
  font-family: 'Noto Sans CJK SC';
  src: url('../isola/font/NotoSansCJKSC.eot');
  src:
    url('../isola/font/NotoSansCJKSC.eot?#font-spider') format('embedded-opentype'),
    url('../isola/font/NotoSansCJKSC.woff') format('woff'),
    url('../isola/font/NotoSansCJKSC.ttf') format('truetype'),
    url('../isola/font/NotoSansCJKSC.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

因为本站不止一个安装了一个主题,所以相对路径的起始点其实是themes目录。

熬夜真是可怕……赶紧滚去睡觉了