css显⽰⽂字时怎么加空格,css的text-align-last属性，以及IE下
text。。。
text-align-last属性
text-align-last⽤来定义block元素或者多⾏⽂本因为容器宽度⾃动断⾏，形成多⾏⽂本时的最后⼀⾏⽂本的对齐模式，这⾥你可能会说，我们有text-align不就搞定了。确实，⼤部分情况下的text-align就可以达到我们对⽂本的对齐要求，但是在text-align:justify定义⽂本两端对齐的时候，这个两端对齐对最后⼀⾏是不管作⽤的。当然你也可以采⽤text-algin⽂中处理最后⼀⾏的两端对齐的⽅式。但是使⽤text-align-last来处理最后⼀⾏的两端对齐⽆疑更加简单。
说了这么多，你可能对text-align-last还是提不起兴趣来，那么我们来看⼀个他的实际应⽤，或许能提⾼你对text-align-last的兴趣：
⽐⽅我们有⼀个这样的form表单输⼊，对于名称这块，我们想要让他实现两端对齐的效果，那么你就可以这名称属性的样式上加⼀句text-align-last:justify来达到这⼀效果：.t_name{
width:80px;
box-sizing:border-box;
padding:0 6px;
margin-left:-100%;
text-align-last:justify;
}
然后效果就变成下⾯这样了：
虽然，乍⼀看，像是达到效果了，但是细看，发现第⼀⾏的“客户姓名”好像没有达到两端对齐的效果。这⾥的具体原因不清楚，但是在chrome浏览器下需要添加text-align:justify，才能让第⼀⾏两端对齐。我猜测是因为第⼀⾏的“客户姓名”其实是已经换⾏了，它已经不算是最后⼀⾏了，但是由于换⾏的是⼀个空⽩字符，所以没有增加⾼度，看起来还是⼀⾏内容。所以我们需要做⼀下修改：.t_name{
width:80px;
box-sizing:border-box;
padding:0 6px;
margin-left:-100%;
text-align: justify;
text-align-last:justify;
}
box sizing
然后效果就更加精细的两端对齐了
最后再说⼀下，text-align-last:justify这个样式的兼容性不是很好，但是在桌⾯浏览器上，IE,chrome，firfox⽬前是都⽀持的，仍然有可使⽤的空间。
但是在IE下使⽤的话，有⼀个注意点，那么就每⼀个⽂字字符之间要有空格，才能实现text-align-last:justify两端对齐的效果。
这⼀段代码的名称“客户姓名”，“邮箱”的text-align-last的样式是没有效果的：
要想在IE下有效果，需要写成“客 户 姓 名”,"邮 箱"这种形式，才能有两端对齐的效果。
我是在IE8下测试的， 不知道在⾼版本的IE下是否对这个属性有改变。所以，⼀定要记住，如果你在IE下使⽤text-align-last没有效果的时候，⼀定要注意在⽂字字符间添加空格。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。