{font-family:"微软雅黑";}或者{font-family:"Microsoft Yahei"}
如果在文件编码(GB2312、UTF-8 等)不匹配时会产生乱码的错误,
为此,在 CSS 直接使用 Unicode 编码来写字体名称可以避免这些错误。
使用 Unicode 写中文字体名称,浏览器是可以正确的解析的。
unicode编码的微软雅黑表示如下:
{font-family: "\5FAE\8F6F\96C5\9ED1"}
移动端html5手机网站如何定义字体font-family
很多懒友在使用自定义字体时候,很容易像PC端那样定义,其实安卓和ISO系统,对中文字体是不支持,所以定义以后看到效果不是直接定义字体效果,如果需要定义
大家会想到 @font-face 定义为微软雅黑字体并存放到 web 服务器上,在需要使用时被自动下载
@font-face {
font-family: 'MicrosoftYaHei'
src: url('MicrosoftYaHei.eot')/* IE9 Compat Modes */
src: url('MicrosoftYaHei.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('MicrosoftYaHei.woff') format('woff'), /* Modern Browsers */
url('MicrosoftYaHei.ttf') format('truetype'), /* Safari, Android, iOS */
url('MicrosoftYaHei.svg#MicrosoftYaHei') format('svg')/* Legacy iOS */ }
使用rem,rem是CSS3新增的一个相对单位(root em,根em)。字体大小是根据根元素而变动的,那么在手机上字体大小也会做相应变化。
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth
if (!clientWidth) return
docEl.style.fontSize = 20 * (clientWidth / 320) + 'px'
}
if (!doc.addEventListener) return
win.addEventListener(resizeEvt, recalc, false)
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window)