大学生Web开发一大作业（静态网页）
2024-06-02 11:59:17
Web开发大作业
有需要的拿去
PS：图片和路径需要自己设置哦~
图片在下面网盘里面。路径大概就是网盘文件的路径
链接: https://pan.baidu.com/s/1HE7dbH8FfIK2m0c9yIp-PA?pwd=39tb 提取码: 39tb 复制这段内容后打开百度网盘手机App，操作更方便哦
PSS：有需要制作网页的可以联系我。
<!DOCTYPE html>
<html>
<head><title>布鲁克林篮网队</title><meta charset="utf-8"><link rel="stylesheet" type="text/css" href="webzuoye8.css"><link rel="shortcut icon" href="eight/netslogo.ico">
</head>
<body><!--头部--><div class="header-top-top"><div class="top-top"><div class="top-top-left"><img src="eight/NBA.png" alt="nbalogo"/><a href="#">NBA中国官方网站</a></div><div class="top-top-right"><a href="#">布鲁克林篮网队官方微博</a><img src="eight/net3.png" alt="weibologo"/></div></div><div class="top-bottom"><div class="top-bottom-left"><img src="eight/netlit.png" alt="net"/><h1>布鲁克林篮网队</h1><p>常规赛 48胜-24负 | 东部第2名</p><p>English</p></div><div class="top-bottom-right"><p>主教练<a href="#">史蒂芬·纳什</a></p><p>分区<a href="#" id="g1">东部 | 大西洋分区</a></p><p>球馆<a href="#" id="g2">巴克莱中心</a></p></div></div></div><!-- 导航栏 --><div class="navb"><div class="nav"><p><a href="#" id="s1">首页</a><a href="#">视频</a><a href="#">新闻</a><a href="#">球员</a><a href="#">赛程</a><a href="#">统计</a><a href="#">图片</a><a href="#">商城</a></p><div class="sousuo"><form action="#"><input type="text" name="sousuokuang" value="了解更多" id="s3" /><input type="submit" name="dl" value="搜索" id="s2" /></form></div></div></div><!-- banner图 --><div class="banner"><img src="eight/three.jpg" alt="banner"></div><!-- 球队赛程 --><div class="bottom"><div class="bottom-top"><div class="bottom-top-right"><p>球队赛程</p><ul><li id="a1">日期<a href="#">对手</a>比分</li><li id="a3">05月29日<a href="#">凯尔特人</a>119-125</li><li>05月31日<a href="#">凯尔特人</a>141-126</li><li>06月02日<a href="#">凯尔特人</a>123-109</li><li id="a2">06月06日<a href="#">雄鹿</a>115-107</li><li id="a4">06月08日<a href="#">雄鹿</a>125-86</li></ul></div><div class="bottom-top-left"><p>布鲁克林篮网在G2以39的大比分获胜后,这轮系列赛大比分来到2：0！</p><h3>布鲁克林篮网官方微博头像更新为：</h3><div class="bottom-top-left-ph"><img src="eight/netslogo2.jpg" alt="lanwang" /><img src="eight/netslogo.ico" alt="lanwang" /></div></div></div></div><!-- 球队新闻和消息 --><div class="new-top"><div class="new"><div class="new-top-left"><div class="new-top-left"><div class="new-top-top1"><h3>最新资讯</h3><div id="b1"></div><h2>杜兰特32+6欧文22分 篮网狂胜雄鹿2-0</h2><img src="eight/0.jpg" alt="kd" /><p>北京时间6月8日，NBA东部季后赛半决赛继续进行，布鲁克林篮网主场迎战密尔沃基雄鹿，詹姆斯-哈登因伤缺阵，篮网投进了21记三分，半场之后便失去了悬念。篮网最终125-86狂胜雄鹿，总比分2...</p><br/><div class="news"><div id="b2">2021-6-8 10:04</div><div id="b3">评论(182)</div></div><div id="b4"></div></div><div class="new-top-top2"><div id="b1"></div><h2>哈登伤退 格里芬：万幸我们对此很有经验</h2><img src="eight/0.jpg" alt="kd" /><p>北京时间6月6日，东部季后赛首轮，篮网主场115-107战胜雄鹿，赛后篮网队的主要球员接受了媒体采访。 本场比赛，詹姆斯-哈登在比赛开场不到一分钟时就受伤离场。对此凯文-杜兰特表示：“...</p><br/><div class="news"><div id="b2">2021-6-6 14:54</div><div id="b3">评论(25)</div></div><div id="b4"></div></div><div class="new-top-top3"><h2>战术策：篮网无登也赢 雄鹿急需反思</h2><img src="eight/0.jpg" alt="kd" /><p>令人意外地，哈登仅仅出战43秒就伤退了。 更令人意外地，雄鹿这也能输。 篮网剩余两巨头个人能力当然依然强无敌，两人在中近距离合计24投15中，和雄鹿全队的篮下命中率相当，这简直有违...</p><br/><div class="news"><div id="b2">2021-6-6 14:21</div><div id="b3">评论(46)</div></div><div id="b5"></div> </div></div><div class="new-top-left2"><div><form action="#"><div class="f1">登录为篮网投票支持</div><div class="f2">账号：<input type="text" name="yname" value="请输入你的账号" /></div><div class="f2">密码：<input type="password" name="p1" value="" /></div><div class="f3"><input type="checkbox" name="xuanze" /><a>我已阅读用户协议</a></div><div class="f4"><input type="submit" name="denglu" value="登录" /><input type="submit" name="zhuce" value="注册"/></div></form></div></div></div><!-- <div class="new-top-left2"><div><form action="#"><div>登录为篮网投票支持</div><div>账号:<input type="text" name="yname" value="请输入你的账号" /></div><div>密码<input type="password" name="p1" value="" /></div><div><input type="checkbox" name="xuanze" /><a>我已阅读用户协议</a></div><div><input type="submit" name="denglu" value="登录" /><input type="submit" name="zhuce" value="注册"/></div></form></div></div> --><div class="new-top-right"><div class="new-top-right-1"><h3>技术统计</h3></div><div class="new-top-right-2"><div class="c1"><p class="d2">场均得分</p><p class="d1">105.8</p><p>联盟第12</p></div><div class="c2"><p class="d2">场均得分</p><p class="d1">105.8</p><p>联盟第12</p></div><div class="c3"><p class="d2">场均得分</p><p class="d1">105.8</p><p>联盟第12</p></div><div class="c4"><p class="d2">场均得分</p><p class="d1">105.8</p><p>联盟第12</p></div><div class="c5"><p class="d2">场均得分</p><p class="d1">105.8</p><p>联盟第12</p></div><div class="c6"><p class="d2">场均得分</p><p class="d1">105.8</p><p>联盟第12</p></div></div></div><div class="new-top-right2"><div class="new-top-right2-1"><h3>数据王</h3></div><div class="new-top-right2-2"><ul><li class="e1">得分</li><li class="e2">1<a href="#">凯文·杜兰特</a>31.8</li><li class="e2">2<a href="#">凯里·欧文 </a>24.1</li><li class="e2">3<a href="#">詹姆斯·哈登</a>23.2</li></ul></div><div class="new-top-right2-3"><ul><li class="e1">篮板</li><li class="e2">1<a href="#">凯文·杜兰特</a>7.6</li><li class="e2">2<a href="#">布鲁斯·布朗</a>6.1</li><li class="e2">3<a href="#">詹姆斯·哈登</a>6.1</li></ul></div><div class="new-top-right2-4 "><ul><li class="e1">得分</li><li class="e2">1<a href="#">詹姆斯·哈登</a>31.8</li><li class="e2">2<a href="#">凯文·杜兰特</a>24.1</li><li class="e2">3<a href="#">凯里·欧文 </a>23.2</li></ul></div><div class="new-top-right2-4"><h3>篮网三巨头</h3><img src="eight/three2.jpg"/></div></div></div></div><!-- team --><div class="team"><img src="eight/team.png" alt="team" /></div><!-- 版权信息 --><div class="b"><div class="bb"><div class="b-b"><div class="b-1"><h3>关于</h3><a href="#">NBA store</a><br/><a href="#">NBA就职机会</a></div><div class="b-2"><h3>赛事</h3><a href="#">全明星赛</a><br/><a href="#">2015Jr.NBA高中赛</a></div><div class="b-3"><h3>专题</h3><a href="#">2016休赛期转会</a><br/><a href="#">2016选秀大会</a><br/><a href="#">联盟的骄傲</a><br/><a href="#">新春贺岁</a><br/><a href="#">叩响盛夏</a></div><div class="b-4"><h3>NBA 101</h3><a href="#">编年史</a><br/><a href="#">50大球星</a><br/><a href="#">NBA知识Q&A</a></div><div class="b-5"><h3>手机看比赛 下载APP</h3><img src="eight/em.png" alt="erweima" /></div></div><div class="b-b2"><p>©2020年著作权 NBA 中国所有权。</p><p><a href="#">NBA.com/China</a>上除去使用条款中所特别提及的部分之外，其它任何内容都不得以任何形式被复制、再传播，或篡改。</p><p>进入<a href="#">NBA.com/China</a>后，即表示阁下同意遵守<a>NBA.com/China</a>的隐私政策和使用条款。</p><p>有任何的建议和意见，都欢迎联络我们：<a href="#">NBAChinaInfo@nba.com</a></p><p>有关NBA商品授权合作事宜，敬请联系:<a href="#">GMGChinaBusinessInquiry@nba.com</a></p></div></div></div>
</body>
</html>*{padding: 0px;margin: 0px;
}
a{text-decoration: none;color: white;
}
li{list-style-type: none;
}
body{background-image: url(https://ww2.sinaimg.cn/woriginal/74a9965ajw1ea7l0ar1obj21hc0u0n68.jpg);
}
/*澶撮儴*/
.header-top-top{background-color: #0f0f0f;width:100%;height:220px;
}
.top-top{width:1000px;height:50px;margin: 0px auto;
}
.top-top-left{float: left;width: 500px;height: 50px;
}
.top-top-left img{padding-right: 8px;padding-left: 4px;
}
.top-top-right{float: right;height:50px;
}
.top-top-left img{float: left;
}
.top-top-right img{float: right;
}
.top-top-left a{line-height: 50px;
}
.top-top-right a{line-height: 50px;font-family: '骞煎渾';
}
.top-bottom{width: 1000px;height: 170px;margin: 0px auto;
}
.top-bottom-left{width: 500px;height: 170px;float: left;
}
.top-bottom-left img{float: left;padding-right: 20px;
}
.top-bottom-left p{color: white;padding-top: 2px;padding-bottom: 2px;
}
.top-bottom-left h1{color: white;padding-top: 17px;padding-bottom: 15px;
}
.top-bottom-right{/*width: 500px;*/height: 170px;float: right;margin-top: 20px;text-align: right;
}
.top-bottom-right p{color: white;padding-top: 5px;padding-bottom: 5px;
}
.top-bottom-right a{padding-left: 100px;
}
#g1{padding-left: 74px;
}
#g2{padding-left: 120px;
}
.navb{background-color: #1E1E1E;width: 100%;height: 70px;
}
/*瀵艰埅鏍?/
#s1{background-color: #373737;
}
.nav{width: 1000px;height: 70px;margin: 0px auto;
}
.nav p a{padding-right: 45px;font-size: 20px;height: 70px;line-height: 70px;color: #fff;display: inline-block;
}
.nav p{width: 750px;float: left;
}
.nav p a:hover{background-color: #373737;
}
.banner img{width: 100%;height: 500px;
}
.sousuo{float: right;
}
.sousuo input{width: 180px;height: 30px;
}
#s2{width: 50px;margin-top: -28px;
}
/*涓儴*/
.bottom{width: 100%;height: 400px;
}
.bottom-top{width: 1000px;height: 400px;margin: 0px auto;
}
.bottom-top-right{width: 430px;height: 340px;float: right;margin-top: 30px;background-color: #fff;
}
.bottom-top-right p{font-size: 25px;color: #ffffff;padding-left: 8px;background-color: #1E518C;padding-top: 8px;padding-bottom: 8px;
}
#a1{background-color: #9E9E9E;font-size: 20px;height: 30px;line-height: 30px;padding-left: 50px;color: #fff;
}
#a1 a{padding-left: 100px;padding-right: 100px;color: #fff;
}
.bottom-top-right li{padding-left: 32px;font-size: 18px;padding-top: 10px;padding-bottom: 10px;
}
.bottom-top-right a{color: #68B7EC;padding-left: 63px;padding-right: 66px;
}
#a2 a{padding-right: 85px;padding-left: 81px;
}
#a3{padding-top: 20px;
}
#a4 a{padding-right: 85px;padding-left: 81px;
}
.bottom-top-left-ph img{width: 170px;height: 170px;padding-top: 40px;padding-right: 50px;padding-left: 50px;
}
.bottom-top-left{width: 550px;height: 340px;margin-top: 30px;float: left;
}
.bottom-top-left p{font-size: 16px;background-color: #1E518C;color: #fff;padding-top: 14px;padding-bottom: 15px;padding-left: 8px;line-height: 20px;
}
.bottom-top-left h3{background-color: #9E9E9E;color: #fff;padding-left: 15px;padding-top: 12px;padding-bottom: 12px;
}
/*鏂伴椈1*/
.new-top{width: 100%;height: 1190px;
}
.new{width: 1000px;height: 1190px;margin: 0px auto;
}
.new-top-left{width: 550px;height: 890px;float: left;
}
.new-top-top1{width: 550px;height: 300px;background-color: #fff;
}
.new-top-top1 h3{background-color: #1E518C;color: #fff;padding-left: 8px;padding-top: 8px;padding-bottom: 8px;font-weight: lighter;
}
#b1{border-bottom: solid #E8E8E8 2px;height: 25px;
}
.new-top-top1 h2{padding-left: 25px;padding-top: 20px;padding-bottom: 20px;
}
.new-top-top1 img{width: 200px;height: 120px;padding: 0px 20px 0px 25px;float: left;
}
.new-top-top1 p{padding-right: 5px;line-height: 25px;}
.news div{display: inline-block;color: #7a7a7a;
}
#b2{padding-left: 25px;
}
#b3{float: right;padding-right: 5px;
}
/*#b4{border-bottom: solid #E8E8E8 2px;height: 25px;
}*/
/*鏂伴椈2*/
.new-top-top2{width: 550px;height: 300px;background-color: #fff;
}
.new-top-top2 h3{background-color: #1E518C;color: #fff;padding-left: 8px;padding-top: 8px;padding-bottom: 8px;font-weight: lighter;
}
#b1{border-bottom: solid #E8E8E8 2px;height: 25px;
}
.new-top-top2 h2{padding-left: 25px;padding-top: 20px;padding-bottom: 20px;
}
.new-top-top2 img{width: 200px;height: 120px;padding: 0px 20px 0px 25px;float: left;
}
.new-top-top2 p{padding-right: 5px;line-height: 25px;}
.news div{display: inline-block;color: #7a7a7a;
}
#b2{padding-left: 25px;
}
#b3{float: right;padding-right: 5px;
}
#b4{border-bottom: solid #E8E8E8 2px;height: 25px;
}
/*鏂伴椈3*/
.new-top-top3{width: 550px;height: 260px;background-color: #fff;
}
.new-top-top3 h3{background-color: #1E518C;color: #fff;padding-left: 8px;padding-top: 8px;padding-bottom: 8px;font-weight: lighter;
}
#b1{border-bottom: solid #E8E8E8 2px;height: 25px;
}
.new-top-top3 h2{padding-left: 25px;padding-top: 20px;padding-bottom: 20px;
}
.new-top-top3 img{width: 200px;height: 120px;padding: 0px 20px 0px 25px;float: left;
}
.new-top-top3 p{padding-right: 5px;line-height: 25px;}
.news div{display: inline-block;color: #7a7a7a;
}
#b2{padding-left: 25px;
}
#b3{float: right;padding-right: 5px;
}
#b5{border-bottom: solid #E8E8E8 2px;height: 25px;
}
/*鍙宠竟鎶€鏈粺璁?/
.new-top-right{float: right;width: 430px;height: 430px;background-color: #fff;
}
.new-top-right-1 h3{background-color: #1E518C;font-weight: lighter;color: #fff;padding: 8px 0px 8px 8px;margin-bottom: 25px;
}
.new-top-right-2{padding: 0px 25px 25px 25px;
}
.c1{width: 125px;height: 165px;float: left;border-right: solid 2px #e8e8e8;border-bottom: solid 2px #e8e8e8;text-align: center;
}
.c2{width: 125px;height: 165px;float: left;border-right: solid 2px #e8e8e8;border-bottom: solid 2px #e8e8e8;text-align: center;
}
.c3{width: 125px;height: 165px;float: left;border-bottom: solid 2px #e8e8e8;text-align: center;
}
.c4{width: 125px;height: 165px;float: left;border-right: solid 2px #e8e8e8;text-align: center;
}
.c5{width: 125px;height: 165px;float: left;border-right: solid 2px #e8e8e8;text-align: center;
}
.c6{width: 125px;height: 165px;float: left;text-align: center;
}
.d2{padding-top: 45px;
}
.d1{color: #454545;font-size: 20px;
}
/*鏁版嵁鐜?/
.new-top-right2{float: right;width: 430px;height: 700px;background-color: #fff;margin-top: 28px;
}
.new-top-right2-1 h3{background-color: #1E518C;font-weight: lighter;color: #fff;padding: 8px 0px 8px 8px;
}
.new-top-right2 a{color: black;padding-left: 80px;padding-right: 80px;
}
.e1{color: #2464B5;padding-top: 15px;padding-bottom: 15px;font-size: 25px;padding-left: 194px;
}
.e2{font-size: 18px;padding-left: 40px;line-height: 30px;
}
.new-top-right2-4 h3{text-align: center;padding-bottom: 18px;padding-top: 12px;
}
.new-top-right2-4 img{width: 300px;height: 150px;padding-left: 65px;
}
/*琛ㄥ崟*/
.new-top-left2{float: left;background-image: url(https://ww2.sinaimg.cn/woriginal/74a9965ajw1ea7l0ar1obj21hc0u0n68.jpg);width: 550px;height: 270px;
}
.f1{color: #fff;font-size: 25px;text-align: center;padding-top: 30px;padding-bottom: 7px;
}
.f2{color: #fff;font-size: 20px;padding: 10px 0px 5px 20px;
}
.f2 input{height: 30px;width: 200px;
}
.f3{color: #fff;padding-left: 80px;padding-top: 5px;padding-bottom: 5px;
}
.f3 input{padding-top: 10px;
}
.f4{padding-left: 80px;padding-top: 5px;
}
.f4 input{width: 60px;height: 30px;padding-left: 10px;padding-right: 10px;
}
.b{width: 100%;height: 500px;background-color: #333333;
}
.bb{width: 1000px;height: 500px;margin: 0px auto;
}
.b-b{width: 1000px;height: 250px;border-bottom: dashed 3px #3c3c3c;
}
.b-b a{color: #ccc;line-height: 25px;font-size: 14px;
}
.b-1{width: 200px;height: 250px;float: left;
}
.b-1 h3{color: #fff;font-weight: lighter;padding-top: 30px;padding-bottom: 30px;
}
.b-2{width: 200px;height: 250px;float: left;
}
.b-2 h3{color: #fff;font-weight: lighter;padding-top: 30px;padding-bottom: 30px;
}
.b-3{width: 200px;height: 250px;float: left;
}
.b-3 h3{color: #fff;font-weight: lighter;padding-top: 30px;padding-bottom: 30px;
}
.b-4{width: 200px;height: 250px;float: left;
}
.b-4 h3{color: #fff;font-weight: lighter;padding-top: 30px;padding-bottom: 30px;
}
.b-5{width: 200px;height: 250px;float: left;
}
.b-5 h3{color: #fff;font-weight: lighter;padding-top: 30px;padding-bottom: 30px;
}
.b-5 img{padding-left: 23px;
}
.b-b2{text-align: center;padding: 62px;
}
.b-b2 a{color: #ccc;font-size: 14px;line-height: 25px;
}
.b-b2 p{color: #ccc;font-size: 14px;line-height: 25px;
}
.b-b2 a:hover{text-decoration: underline;
}
.b-b a:hover{text-decoration: underline;
}
/*team*/
.team{width: 1000px;height: 330px;margin: 0px auto;margin-bottom: 30px;
}
.team img{width: 1000px;height: 330px;
}大学生Web开发一大作业（静态网页）相关推荐
- HTML5+CSS大作业——个人博客-功能齐全(48页) html大学生网站开发实践作业
HTML5+CSS大作业--个人博客-功能齐全(48页) html大学生网站开发实践作业 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. 宠物. 电器. 茶叶. 家居. 酒店. ...
- HTML5期末大作业：化妆品商城网站设计——化妆品商城-功能齐全(43页) HTML+CSS+JavaScript web大作业 静态网页
HTML5期末大作业:化妆品商城网站设计--化妆品商城-功能齐全(43页) HTML+CSS+JavaScript web大作业 静态网页 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游 ...
- HTML5期末大作业：棋牌游戏网站设计——棋牌游戏(8页) HTML+CSS+JavaScript web大作业 静态网页
HTML5期末大作业:棋牌游戏网站设计--棋牌游戏(8页) HTML+CSS+JavaScript web大作业 静态网页 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. 宠物 ...
- DIV布局——化妆品商城-功能齐全(43页) HTML+CSS+JavaScript web大作业 静态网页
HTML5期末大作业:化妆品商城网站设计--化妆品商城-功能齐全(43页) HTML+CSS+JavaScript web大作业 静态网页 文章目录 HTML5期末大作业:化妆品商城网站设计--化妆品 ...
- 个人设计web前端大作业~ 酒店网页设计(HTML5+CSS3+Bootstrap)
个人设计web前端大作业~ 酒店网页设计(HTML5+CSS3+Bootstrap)瑞豪国际酒店 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要 ...
- web开发-前端作业-做一个简单网页
一.设计思路与主题 设计思路:一直在跟pink老师学前端,有次表单练习是关于相亲网站的,于是突发奇想,打算把这个东西完善一下,再玩个谐音梗"珍禽网"--真情网~(顺便交个作业)主要 ...
- HTML5期末大作业：餐饮饮食网站设计——奶茶(6页) HTML+CSS+JavaScript html大学生网站开发实践作业...
常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. 宠物. 电器. 茶叶. 家居. 酒店. 舞蹈. 动漫. 明星. 服装. 体育. 化妆品. 物流. 环保. 书籍. 婚纱. 军 ...
- Java Web学习(2)：静态网页与动态网页
一静态网页 (1)静态网页概述 在网站设计中,纯粹HTML(标准通用标记语言下的一个应用)格式的网页通常被称为"静态网页",静态网页是 标准的HTML文件,它的文件扩展名是.htm ...
- Web开发课程作业 ：大象基金网上交易系统
大象基金网上交易系统 0 写在前面 1 总体设计 1.1 项目目标及背景 1.2 需求分析 2 详细设计 2.1 详细功能说明 2.2 设计环境 2.3 数据库设计说明 3 系统前端设计 3.1 使用 ...
最新文章
- 使用git上传代码到github
- Js 向json对象中添加新元素
- java之ibatis数据缓存
- OVS DPDK vs OVS Deep Dive（十六）
- java.util.ConcurrentModificationException
- read接收不全linux,linux下串口读写有关问题 read 一次读不全(5)
- 华为宣布：免费培养2000名Java开发者
- James McCrae
- 涉及金钱使用double的已经被公司开除了，要使用BigDecimal
- DevExpress 隐藏Ribbon中barbuttonItem的SuperTip（2）
- Java七大设计模式原则（附相关电子图书下载）
- EditPlus中文版
- Couchbase集群
- 【JTAG、SBW、BSL】MSP430的BSL
- Windows11无法打开 WindowsTerminal 图形化设置界面
- html实现文件的下载
- PTA——基础编程题 | 7-27 冒泡法排序 (20分)
- 树莓派开发和车牌识别
- 对数の学习笔记（一）
- vue根据URL下载文件并重命名