text-align:justify_内容居中对齐

时间：2021-07-19 20:18:29

一直发现text-align : justify这个对齐方式不好使，都不知道为什么么么哒；

因为两端对齐的这个行的结束要一个有空字符串或者别的不可见的字符，用户代理会把这个行的最后几个字符往右边拉，实现两端对齐；

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test-align:justify</title>
</head>
<body>
<style>
p{
    width:200px;
    text-align:justify;
    word-break:break-all;
}
</style>
<p>
    justify居中对齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中对齐齐  justify居中</p>
<p>
    sdfsdfsdfjustfysdfs    f    f    f    f    f     fdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfyustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfy
</p>
<p>
    sdfsdfsdfju                 
     stfysdfsdfsdfjustfysdfsdfsdf                 
     justfysdfsdf                 sdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsd                 
     fsdfjustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfj                 ustfysdfsdfsdfjustfysdfsdfsdfjustfysdfsdfsdfj                 
     ustfyustfysdfsdfsdfjustfysd                 fsdfsdfjustfysdfsdfsdfj                 ustfysdfsdfsdfjustfysdfsdfsdfj                 
     ustfysdfsdfsdfjustfy
</p>
<p>
    我 是一段可以两端对齐的文字， 你 仔细看看， 我 的对齐方式都贴着 容器左右的边缘。
</p>
</body>
</html>

 

标签：

相关文章