修改文本样式
text-transform
https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform
大写:text-transform: capitalize;
隐藏过长的文本,使其显示为省略号
html – text-overflow: ellipsis not working – Stack Overflow
我们需要隐藏文本行过长的部分,使其显示为省略号,保持其仅占有一行,而不是换行继续显示。该笔记将记录:如何隐藏过长文本,使其仅占用一行,而超出的部分显示为省略号。
span { white-space: nowrap; text-overflow: ellipsis; width: 100%; display: block; overflow: hidden }
注意事项,需要设置 width 才可以,否则 text-overflow: ellipsis; 无法生效。
内容居中
配置 div 居中 | https://stackoverflow.com/questions/18649106/vertical-align-middle-in-div
#abc{ font:Verdana, Geneva, sans-serif; font-size:18px; text-align:left; background-color:#0F0; height:50px; display: table; width: 100%; } #abc span { vertical-align:middle; display: table-cell; }