好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

完美全兼容解决文字两端对齐justify中文姓名对齐

text-align:justify; 所有浏览器都支持,text-justify之类的却只有IE支持,就不要考虑了。

justify我的理解,使元素内部的子元素两端对齐,子元素当然只能是inline或inline-block。但justify对最后一行是无能为力的。我们在对齐姓名时,因为只有一行,当作最后一行,所以不会两端对齐的效果。

姓名对齐我们比较常用的是 (半个中文空格), (一个中文空格)来添充两个字,三个字的姓名,使包括四字的姓名都能对齐。例如:

欧阳大咖

张 小 三

王  五

但我们发现大部分浏览器是正常的,但不幸的是我们发现手机浏览器打开大部分是不行的,效果就像下面那样对不齐。

欧阳大咖

张 小 三

王 五

所以就想到了用text-align:justify;但怎么解决单行不能两端对齐呢,思路就是:

   让浏览器认为这不是最后一行就行了

在元素里面加一个会换行的空的子元素比如:

   i   style  ="display:inline-block;width:100%;height:0;"  >  i  >  

查看更多关于完美全兼容解决文字两端对齐justify中文姓名对齐的详细内容...

  阅读:42次