今天的一个偶然机会,看到了一个解决当在安卓移动端的时候,字体小于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>
第二行的代码,大家自己注释掉,然后看移动端的展示效果。下面请看我的截图
这个是设置了这个属性的:
下面的截图是没有设置的: