CSS常用属性

*{
	margin: 0px;
	padding:0px;
}

body{
	margin:0 auto;
	width:100%; 
	font: 13px "宋体",Verdana,Arial,Helvetica,sans-serif;
}
a{
	text-decoration: none;//不显示下划线
}
a:link{color: #6ac3eb;}
a:hover{color: red;}//鼠标悬停时效果
a:visited {color: #6ac3eb}//鼠标点击时效果
a:active {color: #6ac3eb}//鼠标点击之后效果

/*
<div class="main">
	<div class="image"><img src="default.jpg" /></div>
	<div class="text">这个地方显示文字，当文字的长度超出div宽度时，自动隐藏剩余的文字并以省略号代替显示</div>
	
	<div class="ullist">
		<ul>
			<li><a >新闻列表</a></li>
			<li><a >新闻列表</a></li>
		</ul>
	</div>
</div>
*/
.main{
	box-shadow: 0 0 3px #000;//div阴影效果
	background: url("bg.png") no-repeat scroll;//背景图片
	cursor: pointer;//鼠标指针变成手掌型
}

/*图片垂直居中*/
.image{
	height:150px;
	width:150px;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	position:relative;
}
.image img{
	max-width: 150px;border: 0px;
	vertical-align:middle;
}

.text{
	width: 140px;height:30px;
	white-space: nowrap;/* 强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象。不换行 */
	overflow: hidden;/* 内容超出宽度时隐藏超出部分的内容 */
	text-overflow: ellipsis;//将被隐藏的那部分用省略号代替。
}

.ullist ul{ list-style:none;}
.ullist ul li{ 
    cursor: pointer;
    font-weight: normal;
    line-height: 50px;//行高
    text-align: left;//文本左对齐
    text-indent: 10px;//
    background-color: #f2f2f2;//背景颜色
    border-bottom: 1px solid #e0e0e0;//边框
    border-right: 1px solid #e0e0e0;
}