飞龙博客

feilong.org 前端开发教程

两端对齐 justify 测试兼容火狐谷歌Safari 安卓IOS

飞龙修订于 20201007 04:47 462 次浏览

两端对齐 justify 测试兼容火狐谷歌Safari 安卓IOS。

两端对齐 justify

此例子 飞龙进行全面深入测试 如果让 文字左右两端对齐。特别是兼容ios或safari浏览器,该怎么办的解决方案。

text-align:justify; 不处理块内的最后一行文本。 包括块内仅有一行文本,既是第一行也是最后一行。

注意:text-justify 主要针对 IE浏览器中的汉字 进行处理!必须和text-align:justify一起使用才有效。

汉字最好是用加空格打散,才能保证在 Safari 里 也能 完完全全的两端对齐!

.taj{text-align:justify;text-justify:inter-ideograph;overflow:hidden;}

.taj:after{content:'';display:inline-block;width:100%;}

.taf{text-align:justify;text-align-last:justify;text-justify:distribute-all-lines;}

.taf2{text-align:justify;text-align-last:justify;text-justify:inter-ideograph;}

.box{ margin-top:30px;width:300px;background-color:#eee;}

方法一:伪元素加一行,让 text-align:justify 对非最后一行起作用。此法最佳!但是,会多一行高度!

如何设置文本两端对齐呢? 如何设置文本两端对齐呢? 如何设置文本两端对齐呢?对齐呢对齐呢对齐呢......

付费查看剩下内容

网址:https://feilong.org/text-align-last-justify-safari-ios-chrome-ie
初发:20181012 09:59

想学前端?长按二维码加我微信

想学前端?点击飞龙QQ

分类: 前端开发

新作:

旧文:

  • 言色和悦对父母
    有无相通待亲友
关闭

长按二维码 -> 识别图中二维码

打开微信,发现,扫一扫

支付完成后,点击下一步

感谢大力支持

然后你手机号:

最后点这,稍等即可