首页手记【学习笔记】文字两端对齐的完美解决方法

【学习笔记】文字两端对齐的完美解决方法

标签：

Html/CSS

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="tips" content="为了以后方便，把常用的小效果制作整理，如有问题或者更好的方法，请告知！谢谢！！！！">
<meta name="author" content="QQ邮箱：30860662@qq.com">
<title></title>
<style>
.box1{width:200px;height:25px;text-align:justify; text-justify:distribute-all-lines;}
.box1 span{width:100%;display: inline-block / Opera /; font-size:0;line-height:0;height:0;}

box2 p{width:200px;height:32px;border:1px solid #ddd;font-size:20px;text-align:justify;text-justify:distribute-all-lines;

}

box2 p:after{display:inline-block;content:'';width:100%;height:0;}

/
兼容IE浏览器：text-justify:distribute-all-lines;
后面要写span，必须设为行内块
兼容：IE5,7,8,9,10,11,IE6未测,safari
注意：要兼容safari浏览器，需要文字间加空格
/
</style>
</head>