在我们制作表单或者个人信息的时候,经常会遇到类别名称字数不一致的问题,为了使网页更加美观我们一般使其两端对齐,或许我们都经历过使用空格处理阶段,现在用css就可以解决啦。
text-align 属性
text-align属性可以指定元素文本的水平对齐方式。
属性值
值 | 描述 |
---|---|
left | 把文本排列到左边。默认值:由浏览器决定。 |
right | 把文本排列到右边。 |
center | 把文本排列到中间。 |
justify | 实现两端对齐文本效果。 |
inherit | 规定应该从父元素继承 text-align 属性的值。 |
这次我们要用到的属性值是 justify ,但是如果你直接使用是没有效果的,需要配合 text-align-last 和 width 使用。
text-align-last 把段落的最后一行向右对齐,只有在 justify 时才起作用
width 宽度一般根据类别名最大长度来确定,不然会自适应成父级盒子的100%
使用方法
div{
width:80px;
text-align-last: justify;
text-align: justify;
}