前端外包优质服务商云客秀

我们凭借着对品牌的深刻理念,互联网营销趋势的敏锐洞察,帮助企业通过互联网建立优势。

当前位置:
首页>
荆州网站建设

web初学经验:对于IOS不兼容 text-algin:justify

  • 2021-08-03

最近在写页面的时候遇到了一个问题—当行文本双端对齐,大家都知道CSS属性中有一个“text-align:justify”,但是这个属性使用的时候,要求还是挺多的,尤其是要实现单行文本双端对齐。在对于安卓系统时兼容很容易实现,但是在对于IOS系统,小编在网上查找多翻资料,统统不生效,基乎想用空格来代替。最终还是找到了解决方案.

text-align:justify

当文本出现换行,则除最后一行的所有文本都会实现两端对齐。这时我们想到利用::after伪类,给元素最后设置一个看不见的内联元素,并设置宽度为100%,就可以让我们可以看到的单行文本让浏览器认为是多行文本,从而实现单行文本的两端对齐。

对于安卓系统,很简单。

web初学经验:对于IOS不兼容 text-algin:justify

当对于IOS系统,需要利用::after伪类,给元素最后设置一个看不见的内联元素,并设置宽度为100%

web初学经验:对于IOS不兼容 text-algin:justify


如果不这么写,不管你用火狐浏览器,谷歌浏览器看出来的效果都是对齐的,但是,上传服务器时,却是ISO不兼容,小编测试多次,记住利用::after伪类,给元素最后设置一个看不见的内联元素,并设置宽度为100%。



云客秀网络科技为您提供更高的性价比技术外包服务

菜单