//index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>the final project</title>
<link rel="stylesheet" href="css/finalproject.css" />
<script src="js/finalproject.js" ></script>
<style>
*{
padding:0px;
margin:0px;
}
.bkgimg
{
background-image: url("img/b.jpg");
background-repeat: repeat;
}
</style>
</head>
<body onload="chk()" class="bkgimg">
<center>
<div id="characterintro">
<div id="characterT">
<span style="background-color: #ccc;line-height: 40px;">主要人物介绍</span>
</div>
<div id="characterimg1">
<div class="cha" id="c1">
<img src="img/zhangqilingintro.jpg">
</div>
<div class="cha" id="c2">
<img src="img/wuxieintro.png">
</div>
<div class="cha" id="c3">
<img src="img/heixiaziintro.jpg">
</div>
</div>
</div>
</center>
</body>
</html>
//.css
*{
font-family: "微软雅黑";
font-size: 18px;
margin:0px;
}
table{
margin-top: 15px;
}
tr{
height:50px;
}
a{
text-decoration: none;
}
div{
border-radius: 2px;
}
#characterT
{
width:90%;
height:40px;
border:2px solid #c0c0c0;
background-color: #ccc;
}
#characterimg1
{
width:90%;
height:368px;
border:2px solid #0000FF;
}
#c1
{
float:left;
}
.cha{
width:214px;
height:368px;
border: 1px solid #4c5b70;
margin-right: 10px;
}
#c3
{
float:right;
}
