解决text-align: justify;浏览器、安卓手机不兼容问题

1.兼容PC端浏览器

.h_text{ text-align:justify; text-justify:inter-ideograph;200px;}
 .span_hid{ display:inline-block; 100%;}
<h1 class="h_text">这一行要两端对齐<span class="span_hid"></span></h1>

 text-align:justify :只有一行文字或者最后一行文字,是没效果的,默认靠左对齐

 text-justify:inter-ideograph;增加或减少词间的空格

2.兼容手机浏览器与safair

 每个文字之间添加了一个空格,成功解决了各浏览器不兼容、手机端不兼容的问题。

.h_text{ text-align:justify; text-justify:inter-ideograph;200px;} .span_hid{ display:inline-block; 100%;}
<h1 class="h_text">这 一 行 要 两 端 对 齐<span class="span_hid"></span></h1>

3.

当然文字少是没啥问题,但是文字比较多的话,需要一些JS代码给文字之间加空格。

var text= "这一行要两端对齐";
var result = text.split("").join(" ");

原文地址:https://segmentfault.com/a/1190000013146385

原文地址:https://www.cnblogs.com/liyouwu/p/9723437.html