今天的一个偶然机会,看到了一个解决当在安卓移动端的时候,字体小于12号字的时候,line-height设置不能居中的问题。解决方案也很简单,就是在页面中的html标签中, 添加上lang属性,并且设置为'zh-cmn-hans' 请看下面的代码:
1 <html lang="zh-cmn-hans">
然后我自己测试了以下,确实可以。大家可以自己测试一下。不过需要注意的一点是,需要在安卓真机上查看
1 <!DOCTYPE html>
2 <html lang="zh-cmn-hans">
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
7 <style type="text/css">
8 .box{
9 width: 100px;
10 height: 100px;
11 background: red;
12 transition: all 1s ease-in-out;
13 }
14 .big{
15 width: 200px;
16 height: 400px;
17 background: yellow;
18 }
19 .centerDiv{
20 width: 150px;
21 text-align: center;
22 background: #808080;
23 color: #FFF;
24 height: 14px;
25 border-radius: 20px;
26 margin-top:10px;
27 font-size: 10px;
28 line-height: 14px;
29 }
30 </style>
31 </head>
32 <body>
33 <div class="box">
34
35 </div>
36 <div class="centerDiv">
37 一段中文文字
38 </div>
39 <div class="centerDiv">
40 some English
41 </div>
42 </body>
43 </html>
第二行的代码,大家自己注释掉,然后看移动端的展示效果。下面请看我的截图
这个是设置了这个属性的:
下面的截图是没有设置的: