安卓手机的<a>/<span>的宽高失效

最近在做一个移动端的项目，网页版 在IOS上显示都是妥妥的，可是一部华为中的UC浏览器的效果就让人傻眼了，好多按钮都是都缩在一起，宽高失效。

折腾了半天找不到蛛丝马迹，最后实验发现<a><span>在华为手机中，不能独到height 和 width 只要将标签换做<div> 问题 就解决了

 

原因是：<a> <span> <label> <input> <img> <strong>和<em> 属于行内标签，可以使用display:block 转换成块级元素

其特点是1.在同一行内从左到右按文档流填充 不换行

            2.高度 行高 和底部 都不能改变

            3.宽度就是 图片或者文字的宽度 也不可以改

所以在移动端需要设置行高的按钮 等 结构，尽量避免使用内联元素或转化成块级（block）元素