标签：
<!DOCTYPE html>
css7-文本和其他
text-align
行内元素对齐方式，值为 左/中/右 对齐：left/right/center
.test{text-align:center;}
white-space
超出不换行
normal： 默认处理方式。
nowrap： 强制在同一行内显示所有文本，合并文本间的多余空白，直到文本结束或者遭遇br对象。
.test{white-space:nowrap;}
注意测试代码有时候写一大串不间隔的英文字母后不会自动换行，原因是英文网页排版默认一个单词不换行。
overflow
超出隐藏
visible:默认，不剪切内容
hidden:超出对象尺寸内容裁剪
.test{overflow:hidden;}
white-space和overflow结合，可以做一行文本超出隐藏，例如新闻列表的标题
.test{width:200px; line-height:25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}/*text-overflow属性是超出截断后显示...符号*/
text-indent
文本缩进，像素或em，每行开头缩进
p{text-indent:2em;}/*每段首行缩进2字符，很少用*/
letter-spacing
字符间距
p{letter-spacing:2em;}
letter-spacing和line-height结合，可以把页面字符重叠至一个字。
vertical-align
行内元素在行内的垂直对齐方式
baseline 默认，基线对齐
px或百分比数字，基线算起的偏移量，可为负值
.test{vertical-align:10px;} /*文本向上偏移10px*/
本属性一般用于微调行内元素的上下距离，如果是做上标、下标，建议使用HTML标签<sub>、<sup>
<style>
span{
vertical-align:2px;
font-size:6px;
}
</style>
<div>
E = MC<sup>2</sup>;
</div>
<hr>
CSS属性-其他
/*注释*/
/*这是注释*/
/*
里面的所有代码和内容被注释掉，注意注释不能嵌套
*/
cursor
鼠标放上变化图标
.test{cursor:pointer;}/*鼠标放上手型*/
list-style
修改列表标签样式
.test{list-style:none;}/*去除列表li前面黑点*/
opacity
透明度，最小0，最大1，可以为小数
.test1{opacity: 0.5; filter:alpha(opacity=50);}/*IE6-8不支持opacity，使用filter滤镜实现*/
圆角：IE9以上支持
.test{border-radius:25px;}
<style>
a{text-decoration:none;color:#000;cursor:text;}
div{text-decoration:underline;color:#00f;cursor:pointer;}
</style>
<a href="http://www.baidu.com/">aaaaa</a>
<div>bbbbb</div>
<style>
.yuanjiao{
width:200px;
height:200px;
background:#f00;
border-radius:20px;
}
.yuanjiao2{
width:200px;
height:200px;
background:#0f0;
position:absolute;top:500px;left:100px;
opacity:0.5;
filter:alpha(opacity=50);
}
</style>
<div class="yuanjiao">aaaaaaaaaa</div>
<div class="yuanjiao2">bbb</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br>
标签：
原文地址：http://www.cnblogs.com/lyp123/p/5663019.html
