[分享]css两段对齐justify

在网页设计中，经常需要对齐文本。而CSS中有一个非常实用的属性——justify，可以实现两端对齐（即使左右两端的文本长度不同）的效果。 首先，我们来看一段使用了justify属性的CSS样式代码： ...

在网页设计中，经常需要对齐文本。而CSS中有一个非常实用的属性——justify，可以实现两端对齐（即使左右两端的文本长度不同）的效果。
首先，我们来看一段使用了justify属性的CSS样式代码：

p {
  text-align: justify;
  text-justify: inter-word;
} 

可以看到，这段代码中使用了text-align属性来设置文本对齐方式为两端对齐，同时也使用了text-justify属性来指定对齐方式为按照单词间隔来调整，从而实现更为自然的排版效果。
接下来，我们来理解一下这段代码中的两个属性的作用。
text-align text-align属性用于定义一个元素内容的水平对齐方式。常用取值包括：
- left：左对齐 - right：右对齐 - center：居中对齐 - justify：两端对齐
而在这里，我们选择了justify这种取值，实现了两端对齐的效果。
text-justify 而text-justify属性则是用于指定在文本没有占满整行时如何调整两端对齐。常用取值包括：
- auto：浏览器自动决定 - none：禁止自动调整 - inter-word：按单词间距调整 - inter-character：按字符间距调整
由于我们希望文本看起来更加自然，因此选择了inter-word这种取值，自动调整两边文本之间的距离，从而实现两端对齐的效果。
综上所述，通过text-align和text-justify这两个属性的配合，我们可以实现非常优美的排版效果，让页面看起来更加整洁、美观。