387day（盒子模型复习，新闻列表实例练习）

《2018年10月26日》【连续387天】

标题：盒子模型复习，新闻列表实例练习；

内容：

* {
	margin: 0;
	padding: 0;
}

/*padding : x y z d;  (顺时针)
padding: x y z; (上 左右 下)
padding: x y; (上下 左右)*/

.nav {
	padding: 100px;
	height: 100px;
	width: 100px;
	color: green;
	background-color: green;
}

.cen {
	height: 100px;
	width: 100px;
	background-color: red;
}

.nav {
	padding-left: 100px;
	padding-top: 100px;
	height: 200px;
	width: 200px;
	color: green;
	background-color: green;
}

例子：

		
New Aritcles
		

			
javascript的魅力
			
jQuery
			
平面设计
			
链式编程
			
DOM
		
	

 

* {
	margin: 0;
	padding: 0;
}


.article {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -205px;
	margin-top: -142px;
	border: 1px solid #ccc;
	width: 380px;
	height: 263px;
	padding: 20px 15px 0;
}

.article h1 {
	color: #202026;
	font-size: 20px;
	border-bottom: 1px solid #ccc;
	padding-bottom: 5px;
	margin-bottom: 12px;
}

li {
	list-style: none;
}

.article ul li {
	height: 38px;
	line-height: 38px;
	border-bottom: 1px dashed #ccc;
	text-indent: 2em;
}

.article a {
	font-size: 12px;
	color: #333;
	text-decoration: none;
}

.article a:hover {
	text-decoration: underline;
}