网站建设_北京网站建设_北京网站制作_北京网页设计_北京网站建设公司_[亿美网络]

北京网站建设时网页字体大小解决方案

2019-04-08 08:50

css中字体大小在不同浏览器兼容性问题；
 
 
 
css中使用font-size设定字体大小，不同浏览器的字体height一样，但是width不同，比如在火狐和谷歌中，font-size：20px,字体的高度变为20px，但是谷歌的字体宽度比火狐长
 
 
解决方法如下：
 
 
1、 将浏览器的基准字号设置为 62.5%，也就是 10px，现在 1rem = 10px —— 为了计算方便。然后 在 body上应用 font-size: 2rem;，那么现在body的字体大小就是 20px。
 
 
html { font-size: 62.5%; }
 
body { font-size: 2rem; /* =20px */ }
 
 
 
2、webkit浏览器渲染出来的字体具有一定的平滑效果，所以我们会看到 chrome 渲染出来的字体要大一点并且宽一点,可添加如下内容：
 
 
body {
 
 -webkit-font-smoothing: antialiased;
 
 -moz-osx-font-smoothing: grayscale;
 
}
 
启用浏览器的默认平滑字体效果css：
 
body {
 
 -webkit-font-smoothing: subpixel-antialiased;
 
 -moz-osx-font-smoothing: auto;
 
}
 
设置Chrome下，设置小于12px字体，显示仍为12px
 
-webkit-text-size-adjust:none;
 
chrome浏览器最小字体大小限制的解决方案；
chrome有最小字体大小12px的限制，以前可以用-webkit-text-size-adjust：none来解决。但是chrome27以后就不支持了，而且很影响用户体验。我们可以巧用transform来显示小于12px的字体。代码如下：
 
    .font-6px{
 
      transform: scale(0.5);
 
      font-size: 12px;
 
    }
 
要显示6px的字体，就把字体大小为12px,然后用transform缩小到原来的50%。字体实际显示大小就是6px了。
 
Android浏览器下字体偏上的问题的解决；
 
在Android浏览器下，使用以下几种方式进行字体垂直居中的时候都会导致字体偏上：
 
使用line-height 来使字体垂直居中
 
使用padding 来使字体垂直居中
 
 
本文主要说的是使用<html>标签的lang属性设置为zh-CN 来处理以上问题。
 
<html>标签的lang
 
 
<html>标签的lang 属性可用于网页或部分网页的语言。这对搜索引擎和浏览器是有帮助的。根据 W3C 推荐标准，您应该通过 <html>标签的lang 属性对每张页面中的主要语言进行声明。
 
 
 
如果未声明lang 属性，默认为en ，网页将会使用en 来进行文字渲染，但如果生命为zh-CN ，则会采用中文字体来进行渲染，就可以适当解决在Android浏览器下字体偏上的问题。
 
 
{eyou:prenext get='pre' titlelen='30'} 上一篇： /eyou:prenext} 返回列表

最新动态

相关资讯

【亿美网络】-北京网站建设公司服务支持

我们珍惜您每一次在线网站建设询盘，有问解答，用良好的服务态度，提供北京网站建设服务。

让用户感受或体验到我们技术与服务的不同！

合作流程

网站制作流程从提出需求到网站制作报价，再到网页制作，每一步都是规范和要求的。

常见问题

提供什么是网站定制？你们的报价如何？等网站建设常见问题。

售后保障

网站制作不难，难的是能否提供热情服务及技术支持。我们知道：做网站就是做服务，就是做售后。