优艾设计网

css如何实现图标和文字的“绝对对齐”呢??

前端实现图标和文字对齐有什么解决方法?我的“绝对对齐”的意思是不管是安卓设备和ios设备看着都是对齐的,最好也能实现pc上的对齐。

demo:https://jsfiddle.net/nzfbzxw6/

虽然我通过设置

vertical-align: -3%;

实现的对齐(在chrome上看着好好的),如果我要在手机设备上安卓,就要是另一个数值。
ios可能又要设个数值(而且不同的苹果机型也不一样)。

对这种问题有什么更好的解决方法吗?

----------优艾设计网_设计百科---------------- 一个调皮的分割线 ----------------------------------------

各位前辈的方法我都试了一下,发现在安卓手机上都不好使,图片居中是没有问题的,但是文字(尤其是小于12px下的)却无法居中,这可能是安卓手机bug吧...

(第一个box盒子,第二个display:inline-block,第三个background center)


静静买的小马甲 35分钟前

优艾设计网_设计

元素和元素之间不要出现空格。需要实现距离用margin。


360U1377719505 优艾设计网_Photoshop问答 31分钟前

一般都用背景和定位的方法。vertical-align不好控制,和字体也有关系。


GinoMao 优艾设计网_Photoshop百科 27分钟前


老狼爱吃小羊 23分钟前

优艾设计网_Photoshop问答

不知道有没有更好的办法了。。


再见又何须再见 23分钟前

优艾设计网_设计圈

只是针对你这个问题的话,可以去掉 <img src="/upload/qa/20221223/20221223142020.jpg">,直接用字符串×或者&times;代替。


噗噗卟卟 21分钟前

除了上面说的各种方法外,我觉得最方优艾设计网_Photoshop百科便的还是干脆用个 字符图标 代替那个图片嘛。方便的很!


0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜