h5在Android里文字位置偏下,【CSS】如何解决安卓上按钮文字偏上的问题

比如一个普通的按钮，要做到文字垂直居中

按钮

css设置为：

a {

height: 30px;

line-height: 30px;

font-size: 14px;

text-align: center;

width: 70px;

vertical-align: middle;

}

在chrome上和ios上没有问题，但是在安卓上文字就会明显偏上，如图

试过用table-cell或者line-height设为1,然后用padding来控制高度等方法，都不行，都是偏上的，这个问题怎么解决啊？

回答：

这么巧前段时间我也碰到了一样的问题，

解决方法：使用 flex 布局。

把父元素设为：

display: flex;

align-items: center;

justify-content: center;

使用 autoprefixer 加上前缀以后没有任何兼容性问题。

回答：

a元素是行内元素，得设置为块级元素，设置的height line-height才起作用

回答：

字体小于12px 就会偏上

回答：

使用flex布局，然后设置 line-height:normal; 就可以居中了。

回答：

f12调一下，把安卓的一些默认样式覆盖掉

回答：

这个，反正我是设置line-height和height一样，就会上下居中。不过，看你这个a好像也可以用button代替，button里面的文字自动上下左右居中

回答：

这是在特殊的浏览器才会出现这个问题吧，是line-height导致的，就用flex布局来替代

回答：

在安卓 7.0 使用sans-serif(无衬线) 字体可以解决，

其他版本没有试过

h5在Android里文字位置偏下,【CSS】如何解决安卓上按钮文字偏上的问题相关推荐

html文字位置底部,css文字在底部怎么写
css文字在底部的实现方法:首先新建一个html文件,并使用div标签创建一个模块:然后设置div的class属性为con:接着分别在css标签内创建div和p元素的样式:最后设置其位置属性为绝对定位 ...
h5引用项目里css_HTML中引入CSS 的方式
有 4 种方式可以在 HTML 中引入 CSS.其中有 2 种方式是在 HTML 文件中直接添加 CSS 代码,另外两种是引入外部 CSS 文件.下面我们就来看看这些方式和它们的优缺点. 内联方式 ...
android打包apk进程序闪退,解决安卓打包apk安装后打开闪退的问题
系统版本 Android Studio版本 Build APK方式生成APK 调试的时候好好的,将打完的包传输到手机上进行安装,安装成功,但是一打开就闪退. 没办法,只好通过在命令行运行adb log ...
android显示应用程序未安装,如何解决安卓系统显示应用程序未安装
我们在安装软件的时候经常会遇到应用程序未安装这个问题,尤其是在更新软件或者是从ROM提取出来的软件会出现这样的问题.那我们该如何处理这个问题呢?下面我就为大家列举几个解决这种问题的办法. 产生应用程序 ...
android手指下滑，元素下滑消失，点击按钮，元素上滑显示
先写两个按钮,点击一个,布局下滑隐藏,点击另一个,上滑显示点击按钮,浅绿色的部分隐藏或显示 Button btn = findViewById(R.id.button);Button upBtn = ...
h5前端调用android拍照功能,H5调用Android拍照和摄像以及选取相册
之前一直认为H5调用Android,H5不需要Android配合能直接实现功能.前段时间,自己做这个功能,才发现不是这么回事. H5编写 html文件里只需要标签即可实现代码,代码如下所示: 拍照 ο ...
echarts地图文字重叠解决方案_Echarts扩展地图文字位置错乱的问题
最近在弄echarts 因为要用到扩展地图,所以在官网下载了相应的json文件 ,引入之后发现文字位置错乱于是查找网上资料发现 textFixed : { '大洋洲' : [265, 0], }, ...
span标签内使用icon图标，icon和文字位置水平对齐
使用背景: span标签里面嵌套icon图标,图标位置和文字位置水平无法对齐解决方法: <span>转移方式<y-tooltip class="item" ef ...
盘点在H5小游戏里常用的动效制作套路
近年来,越来越多的自带绚丽动效的H5小游戏如雨后春笋一般冒出来,而也正是这些炫酷的交互动效,才能够成功地吸引住用户的眼球,让用户为此驻足. 而「动效制作」也伴随着H5的大热而火遍前端圈及设计界,下面就 ...

h5在Android里文字位置偏下,【CSS】如何解决安卓上按钮文字偏上的问题

h5在Android里文字位置偏下,【CSS】如何解决安卓上按钮文字偏上的问题相关推荐

最新文章

热门文章