当前位置： 移动技术网 > IT编程>网页制作>CSS > 使用text-align:justify实现两端对齐一例

使用text-align:justify实现两端对齐一例

2017年12月08日  | 移动技术网IT编程  | 我要评论

爸爸去哪儿大电影快播,青鱼胆草,世界上最长的蜈蚣

text-align:justify只能对多行中的非最后一行进行两端对齐。对于单行自己没办法，ie有text-justify 可以解决问题，对了非ie的我的方式比较垃圾，因为只在特殊场合下才会用。

 example source code [www.52css.com]
.justify{
height:1.1em;
overflow:hidden;
text-align:justify;
text-justify :distribute-all-lines;
}
div.cn:after {
content: "__________________________________________";
font-size:100px;
} 
　　对了非ie的我是使用content还增加内容达到有第二行，才会在第一行两端对齐。

　　不过各浏览器对中文的理解不一样。firefox 是直接分割中文，opera不会分割中文，只认空格，要是在中文中间插点半角的英文或者标号它还会对不齐，safari接近opera。都是不加空格没法分。

　　英文比较好，因为大家只能用空格分来单词，不过ie用text-justify :distribute-all-lines来分真是难看得要命。本来想过用htc或者js帮ie，可是发现,ie6好笨的说，家里没ie7不知道怎样。

　　或者敲空格是一种比较好的方式，可firefox这种只放大文本的浏览器一放大文字就xx了，我写的那个烂方法也只有在一定的情况下有用，想起一句话：珍惜生命，远离firefix!

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网