网页制作

最新推荐文章于 2019-04-11 22:36:00 发布

choushuzhao5897

最新推荐文章于 2019-04-11 22:36:00 发布

阅读量175

点赞数

原文链接：https://my.oschina.net/u/4090399/blog/3035289

版权

@charset "utf-8";
/* CSS Document */
*{/*通配符选择器*/
	margin:0px;
	padding:0px;
}
#box{
	/*background-color:#F00;*/
	width:950px;
	height:1300px;
	/*margin:0 auto;*/
	margin:0 auto 0 auto;/*上 右 下 左*/
}
#head{
	background-color:#66F;
	height:255px;
}

#caidan{
	background-color:#FFC;
	height:30px;
}
#caidan ul{
	list-style:none;/*去掉点*/
	float:left;
	height:30px;	
	width:450px;
}
#caidan li{
	line-height:30px;/*设置行居中*/
	float:left;/*可以使列表竖着变横着*/
	margin-left:20px;/*li距离左边那个li的距离*/
}
#caidan a{
	color:#0F0;/*字体颜色*/
	text-decoration:none;/*去掉下划线*/
	font-size:16px;/*字体大小*/
	font-family:"微软雅黑";/*word中常见字体一般都可以写*/
}

#caidan a:hover{/*当鼠标滑过超链接标签时的样式*/
	color:#F60;
}

#left{
	/*background-color:#33C;*/
	height:700px;
	width:300px;
	float:left;/*可以使div横向排排坐*/
}
.guanyuwo{
	height:40px;
	width:290px;
	line-height:40px;/*设置垂直居中，值要和height的值一样*/
	font-size:16px;
	font-weight:bolder;/*加粗，h5本来就是标题，已经加粗过了，不加也可以*/
	border-bottom:#963 solid 2px;
}

#zuozhe img{
	text-align:center;
	border:1px solid #999;/*加边solid实线*/
	padding:8px;/*边与图片有个空白，类似相框*/
	border-radius:10px;/*圆角，值越大，角越园*/
	margin-top:5px;
	margin-left:20px;
}
	
#zuozhe span{
	text-align:center;
	margin:10px;/*一圈的距离*/
	display:block;/*改成盒子元素，可以识别盒子元素的一些属性：margin、border\padding*/ 
	
	font-size:18px;/*字号*/
	padding-top:5px;/*内容距离边的距离-上面的*/
}
#zuozhe p{
	font-family:"微软雅黑";
	font-size:14px;
	color:#FCF;
	line-height:35px;/*行高*/
	text-indent:2em;/*首行缩进2字符，em单位随着字的大小占2个字符空*/
}

#right{
	background-color:#F3F;
	height:700px;
	width:650px;
	float:right;/*可以使div横向排排坐*/
}

#wei{
	background-color:#328048;
	height:80px;
	clear:both;/*清空其他的div的float的影响*/
}

博客世界