html 个人主页效果实例,html ------个人主页制作示例（div布局）

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼

.header{width:1000px;margin-left:auto;margin-right:auto;padding-top:20px;}

.header a{color:Black;text-decoration:none;}

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

.nav { clear:both;margin:auto;height:50px;background: url(images/bg.jpg) repeat-x left 90px;

background-color:#72c3f8;

background-image: url(images/bg.gif);background-repeat: repeat;}

.nav ul {margin:0px;padding:0px;height:50px;}

.nav li{list-style-type:none;font-size:14px;color:Black;height:50px;line-height:50px;float:left;}

.nav li a{padding:0px 10px;color:White;text-decoration:none;height:50px;line-height:50px;display:block;}

.nav ul li a:hover{ background: #72c3f8; text-decoration:none;height:50px;line-height:50px; }

.container

{

margin-left:auto;

margin-right:auto;

width:1000px;

}

.banner{margin-top:10px;width:1000px;margin-left:auto;margin-right:auto;}

.leftDiv

{

width:320px;

float:left;

margin-bottom:20px;

}

.middleDiv

{

width:320px;

margin-left:20px;

float:left;

margin-bottom:20px;

}

.rightDiv

{

margin-left:20px;

width:320px;

float:left;

margin-bottom:20px;

}

.margin_top_10

{

margin-top:10px;

}

.listBox

{

width:300px;

padding-left:9px;

padding-right:9px;

height:400px;

border:1px solid Silver;

}

.listBox h2 {font-size:14px;border-bottom:1px solid #cde0ec;display:block;height:30px;line-height:30px;color:Black;margin:0px;padding:0px; }

.listBox a

{

color:Black;

}

.footer

{

clear:both;width:1000px;margin-left:auto;margin-right:auto;font-size:12px;height:30px;border-top:2px solid #0078c6

}

罗治平个人小站