网页设计的主题是个人博客，这次课设并没有实现交互功能，只是简单设计了一个借以展示自己的空间。
大致功能分析如下：
初始页简单介绍该网页的作用
初始页过渡到个人主页后，说明格子间基本信息
拥有展现博客推文的网页页面
拥有展示摄影空间的网页页面
2019-12-21 21:17:39
595KB
1
网页制作代码+课程总结；旅游网站
CSS代码@charset "utf-8";
body {
font-size: 12px;
color: #666;
text-align: center;
margin: 0px;
padding: 0px;
}
#container{
text-align:left;
padding:0px;
width:1400px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
}
#top{
padding-top:15px;
height:90px;
}
#logo{
margin:0px; padding:0px;
float:left;
width:365px;
text-align:right;
}
.pic{
vertical-align:middle;
padding-right:20px;
}
#ss{
float:left;
width:835px;
text-align:right;
height:35px;
padding-top:0px;
padding-right:200px;
padding-bottom:0px;
padding-left:0px;
margin:0px;
}
#daohang{
margin-top:5px; margin-right:0px;
margin-bottom:0px; margin-left:195px;
float:left;
text-align:right;
padding:0px; height:38px;
width:840px;
}
#daohang ul{
margin:0px; padding:0px;
list-style:none;
}
#daohang ul li{
text-align:center;
float:left; width:90px;
}
#daohang a{
background-image:url(images/bj01.jpg);
display:block; margin:0px;
padding-top:10px;
padding-right:0px;
padding-bottom:13px;
padding-left:0px;
}
#daohang a:link,#daohang a:visited{
color:#FFF;
text-decoration:none;
}
#daohang a:hover{
color:#333;
text-decoration:underline;
}
#banner{
background-image:url(images/pic.jpg);
background-repeat:no-repeat;
height:160px; text-align:center;
padding-top:400px;
padding-right:0px;
padding-bottom:0px;
padding-left:0px; margin:0px;
}
#banner img{
padding:0px 5px 0px 5px;}
.daohang {
font-size: 16px;
color: #09F;
background-color: #060;
text-align: center;
display: block;
}
#footer{
color: #000;
background-image: url(images/bj03.jpg);
background-repeat: repeat-x;
text-align: center;
padding: 30px 0px 29px 0px;
font-size: 16px;
}
2019-12-21 19:58:47
22.66MB
1