CSS 文本对齐方式：两端对齐但向右对齐
在本文中，我们将介绍如何使用CSS将文本对齐方式设置为两端对齐但向右对齐。
阅读更多：CSS 教程
CSS text-align 属性
CSS的text-align属性用于控制文本的对齐方式，常用的取值有”left”（左对齐）、”center”（居中对齐）和”right”（右对齐）。然而，在实际应用中，我们有时需要两端对齐的效果，同时又希望文本倾向于右侧对齐。下面我们将介绍一种实现这种效果的方法。
使用 text-align-last 属性实现两端对齐但向右对齐
CSS的text-align-last属性用于控制段落中最后一行的对齐方式。在大多数浏览器中，该属性的默认值为”auto”，即使用text-align属性指定的对齐方式。然而，在一些支持新一代CSS的浏览器中，text-align-last属性还支持”left”、”center”和”right”这几种值。
要实现两端对齐但向右对齐的效果，我们可以设置text-align为”justify”，同时将text-align-last设置为”right”。这样，文本将以两端对齐的方式显示，并倾向于右侧对齐。
p {
text-align: justify;
text-align-last: right;
}
下面是一个示例，通过CSS实现了两端对齐但向右对齐的效果：
<!DOCTYPE html>
<html>
<head>
<style>
p {
width: 300px;
text-align: justify;
text-align-last: right;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent bibendum auctor urna. Sed id tempus nunc. Cras id felis vel ex fermentum feugiat. Mauris vehicula dignissim scelerisque. Suspendisse potenti. Morbi ullamcorper magna turpis, quis mattis ipsum commodo at. Morbi nec pharetra purus. Integer viverra velit at pulvinar varius. Nunc pretium auctor lobortis. Nullam pharetra nisl ac augue consectetur, a tristique ex volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer libero nisi, semper ac dolor ac, luctus commodo ipsum. Etiam tincidunt condimentum ligula, id cursus risus iaculis ac. Quisque id nunc volutpat, rutrum nunc ac, dapibus justo.</p>
</body>
</html>
在上述示例中，文本将以两端对齐的方式显示，且倾向于右侧对齐。这种效果在一些排版需求较为独特的场景中特别有用，例如书籍、杂志和网站排版等。
总结
通过使用CSS的text-align属性和text-align-last属性，我们可以实现两端对齐但向右对齐的效果。将text-align设置为”justify”，并将text-align-last设置为”right”，即可在支持这些属性的浏览器中达到这种效果。这为我们在一些特殊的排版需求中提供了更多的选择和灵活性。
此处评论已关闭