谁能做一做，zsbd
大学的题，太久没学给忘完了，这几天考试不会做了，zsbdzsbd
早
1.可以选择合适的框架自己去做 例如 bootstrap jquery
2.可以找人去做 加vx:Alison-Bird 价格美丽
我这里也有范例，可以的，什么时候要
页面太多了，我最近设计了一个，看是否需要，一个有很多页面，里面图片加载不出来，因为需要一个文件，文件里面装的是图片和其它页面，主页面代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>web前端实践大作业</title>
<style>
body{
background-color: beige;
width: 1395px;
}
.photo{
border: 0px;
width:100%;
height: 300px;
}
.photo img{
width: 100%;
height: 300px;
}
.img1{
display: block;
}
.img2{
display: none;
}
.form{
position: sticky;
top:0px;
border: 1px solid gold;
background-color: aquamarine;
margin-left: 35%;
width: 390px
}
a{
text-decoration: none;
display: inline-block;
}
.back{
position: fixed;
bottom:180px;
right: 20px;
border: 8px groove palevioletred;
background-color:yellow;
animation-name: example;
animation-iteration-count:10000000000000;
animation-duration: 2s;
animation-direction: reverse;
box-shadow: 5px 5px 5px gold;
border-radius: 100px;
}
@keyframes example{
0%{background-color: greenyellow;font-size: 20px;transform:rotate(0deg);}
25%{background-color: orange;font-size: 25px;transform:rotate(90deg);}
50%{background-color: red;font-size: 30px;transform:rotate(180deg);}
75%{background-color: orangered;font-size: 25px;transform:rotate(270deg);}
100%{background-color: yellow;font-size: 20px;transform:rotate(360deg);}
}
.choose{
position: sticky;
top: 20px;
border: 1px solid beige;
width: 200px;
background-color: greenyellow;
margin-left: 50px;
text-align: center;
font-size: 20px;
height: 720px;
}
.a:hover{
font-size: 35px;
color: red;
}
.book{
height: 250px;
width: 250px;
margin-left:60px;
margin-top: 50px;
}
.book:hover{
height: 300px;
width: 300px;
margin-left: 30px;
}
p{
font-size: 20px;
background-color: aquamarine;
margin-bottom: -10px;
width: 300px;
height: 60px;
font-size: 30px;
text-align: center;
margin-left: 30px;
color: tomato;
}
.bottom{
position: relative;
border:3px solid silver;
height: 150px;
text-align: center;
background-color: silver;
margin-top:50px;
}
.log{
position: relative;
margin-left: 1150px;
border: 1 dashed thistle;
margin-top: -700px;
width: 200px;
height: 250px;
background-color: skyblue;
}
</style>
</head>
<body>
<img src="大作业img/天津科技大学.png" width="100%" height="100px"/>
<div class="photo">
<img class="img-slide img1" src="大作业img/web前端.png" alt="1"/>
<img class="img-slide img2" src="大作业img/一本好书相伴一生.png" alt="2"/>
</div>
<div class="form">
<form action="" method="post" align="center" >
<input type="text" name="shuji" style="width: 300px;border: 5px solid blue;"/>
<input type="submit" value="搜索书籍" style="background-color: aqua;"/>
</form>
</div>
<div class="choose">
<a href="1.大作业主页.html" class="a">全部书籍</a><br /><br />
<a href="2.科普类.html" class="a">科普类</a><br /><br />
<a href="5.小说类.html" class="a">小说类</a><br /><br />
<a href="3.散文类.html" class="a">散文类</a><br /><br />
<a href="4.诗词类.html" class="a">诗词类</a><br />
</div>
<div class="log">
<img src="大作业img/登录.png" width="150px" height="150px" style="margin-left: 25px;margin-top: 25px;"/>
<a href="16.登录.html"><i style="font-size: 30px;text-align: center;margin-left: 75px;">登录</i></a>
</div>
<div>
<table border="3" cellpadding="5pdx" cellspacing="5pdx" width="800pdx" height="2000pdx" align="center" bordercolor="white" bgcolor="aqua" style="margin-top: -250px;" >
<tr>
<td>
<a href="6.物种起源.html"><img src="大作业img/科普1.jpg" class="book"/></a>
<br /><a href="物种起源.html"><p>物种起源</p></a>
</td>
<td >
<a href="7.人类简史.html"><img src="大作业img/科普2.jpg" class="book"/></a>
<br /><a href="7.人类简史.html"><p>人类简史</p></a>
</td>
</tr>
<tr>
<td>
<a href="8.沙丘.html"><img src="大作业img/小说1.jpg" class="book"/></a>
<br /><a href="8.沙丘.html"><p>沙丘</p></a>
</td>
<td >
<a href="9.阿Q正传.html"><img src="大作业img/小说2.jpg" class="book"/></a>
<br /><a href="9.阿Q正传.html"><p>阿Q正传</p></a>
</td>
</tr>
<tr>
<td>
<a href="10.自然史.html"><img src="大作业img/科普3.jpg" class="book"/></a>
<br /><a href="10.自然史.html"><p>自然史</p></a>
</td>
<td >
<a href="11.生命藏在量子中.html"><img src="大作业img/科普4.jpg" class="book"/></a>
<br /><a href="11.生命藏在量子中.html"><p>生命藏在量子中</p></a>
</td>
</tr>
<tr>
<td>
<a href="12.朱自清散文.html"><img src="大作业img/散文1.jpg" class="book"/></a>
<br /><a href="12.朱自清散文.html"><p>朱自清散文</p></a>
</td>
<td >
<a href="13.余秋雨散文.html"><img src="大作业img/散文2.jpg" class="book"/></a>
<br /><a href="13.余秋雨散文.html"><p>余秋雨散文</p></a>
</td>
</tr>
<tr>
<td>
<a href="14.泰戈尔诗选.html"><img src="大作业img/诗歌2.jpg"" class="book"/></a>
<br /><a href="14.泰戈尔诗选.html"><p>泰戈尔诗选</p></a>
</td>
<td >
<a href="15.楚辞.html"><img src="大作业img/诗歌1.jpg" class="book"/></a>
<br /><a href="15.楚辞.html"><p>楚辞</p></a>
</td>
</tr>
</table>
</div>
<div class="back">
<a href="1.大作业主页.html">返回<br />顶部</a>
</div>
<div class="bottom">
<br />
****大学  ****学院  *****专业<br /><br />
创作人：******<br /><br />
创作日期：2022.12.23
</div>
</body>
<script type="text/javascript">
var index=0;
function ChangeImg()
{
index++;
var a=document.getElementsByClassName("img-slide");
if(index>=a.length) index=0;
for(var i=0;i<a.length;i++)
{
a[i].style.display='none';
}
a[index].style.display='block';
}
setInterval(ChangeImg,3000);
</script>
</html>