HTML+CSS网页设计期末课程大作——绿色精美全民健身网站(10页) dreamweaver作业静态HTML网页设计模板
常见网页设计作业题材有
个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他等网页设计题目,A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
获取更多源码
PC电脑端关注我们
🧡作者主页-更多源码
🧡HTML期末大作业文章专栏
文章目录
HTML+CSS网页设计期末课程大作——绿色精美全民健身网站(10页) dreamweaver作业静态HTML网页设计模板获取更多源码一、作品展示二、文件目录三、代码实现四、获取更多源码五、学习资料六、更多源码一、作品展示
二、文件目录
三、代码实现
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>XXX全民健身公共服务平台</title><link rel="stylesheet" href="css/base.css"><link rel="stylesheet" href="css/main.css"><script src="js/jquery-3.2.1.min.js"></script><script src="js/index.js"></script></head><body><!-- header --><div class="header"><div class="w1200 header-top clearfix"><div class="fl title"> <a href="javascript:;">宜昌市体育局官网</a> | <a href="javascript:;">网易宜昌体育频道</a></div><div class="login_box fr"> <a href="javascript:;">登录</a> | <a href="javascript:;">注册</a> </div></div><div class="header_logo clearfix"><div class="w1200 logo_content"> <a href="#"><img src="picture/logo.png" alt=""></a><div class="fr seach"><div class="weap_input clearfix"><input class="fl" type="text" placeholder="请输入关键字"><span class="seach_icon fl"></span> </div><span class="detail">热门搜索：<a href="javascript:;">篮球</a> <a href="javascript:;">健身场馆</a> <a href="javascript:;">健身器材</a> </span> </div></div></div></div><!-- header结束 --> <!-- 内容区域 --><div class="content"> <!-- 导航 --><div class="wrap_nav"><div class="nav w1200"><ul class="clearfix"><li><a href="index.html">首页</a></li><li><a href="huodong.html">赛事活动</a><div class="list_icon"><p><a href="huodongxq.html">宜昌国际马拉松</a></p><p><a href="huodongxq.html">宜昌国际马拉松</a></p><p><a href="huodongxq.html">宜昌国际马拉松</a></p></div></li><li><a href="saishi.html">赛事报名</a><div class="list_icon"><p><a href="sheshixq.html">宜昌国际马拉松</a></p><p><a href="sheshixq.html">宜昌国际马拉松</a></p><p><a href="sheshixq.html">宜昌国际马拉松</a></p></div></li><li><a href="sheshi.html">场馆设施</a><div class="list_icon"><p><a href="sheshixq.html">宜昌国际马拉松</a></p><p><a href="sheshixq.html">宜昌国际马拉松</a></p><p><a href="sheshixq.html">宜昌国际马拉松</a></p></div></li><li><a href="zhidaoyuan.html">社体指导员</a><div class="list_icon"><p><a href="zhidaoyuanxq.html">宜昌国际马拉松</a></p><p><a href="zhidaoyuanxq.html">宜昌国际马拉松</a></p><p><a href="zhidaoyuanxq.html">宜昌国际马拉松</a></p></div></li><li><a href="zuzhi.html">健身组织</a><div class="list_icon"><p><a href="zuzhixq.html">宜昌国际马拉松</a></p><p><a href="zuzhixq.html">宜昌国际马拉松</a></p><p><a href="zuzhixq.html">宜昌国际马拉松</a></p></div></li><li><a href="#">健身地图</a><div class="list_icon"><p><a href="#">宜昌国际马拉松</a></p><p><a href="#">宜昌国际马拉松</a></p><p><a href="#">宜昌国际马拉松</a></p></div></li></ul></div></div><!-- 导航结束 --> <!-- banner --><div class="wrap_banner"> <img src="picture/banner.jpg" alt=""> </div><!-- banner结束 --><div class="w1200 projects"><ul class="clearfix"><li><a href="#"><img src="picture/project1.png" alt=""></a></li><li><a href="#"><img src="picture/project2.png" alt=""></a></li><li><a href="#"><img src="picture/project3.png" alt=""></a></li><li><a href="#"><img src="picture/project4.png" alt=""></a></li><li><a href="#"><img src="picture/project5.png" alt=""></a></li><li><a href="#"><img src="picture/project6.png" alt=""></a></li><li><a href="#"><img src="picture/project7.png" alt=""></a></li></ul></div><!-- 赛事报名和动态 --><div class="enrol w1200 clearfix"><div class="event fl" id="event"><h1>赛事<span>报名</span><i>/全民健身，为健康加油</i></h1><div class="slide-wrap"><ul class="slide-img"><li><div class="event_content clearfix"><div class="one_event fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div><div class="one_event fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div></div><div class="event_content clearfix"><div class="one_event fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div><div class="one_event fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div></div></li><li><div class="event_content clearfix"><div class="one_event fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div><div class="one_event fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div></div><div class="event_content clearfix"><div class="one_event fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div><div class="one_event fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><h2><a href="#">宜昌国际马拉松比赛</a></h2><p>开始时间：-11-05</p><p>开始时间：-11-05</p><a class="my_event" href="javascript:;">我要报名</a> </div></div></div></li></ul><ul class="slide-tab"><li class="slide-tab-on"></li><li class=""></li></ul></div></div><div class="dynamics fr"><div class="dynamics_title clearfix"> <span class="fl">资讯动态</span> <a class="fr" href="javascript:;">more >></a> </div><div class="dynamics_constent"><div class="clearfix dynamics_text"><p class="fl"><a href="#">综合管理服务中心党支部学习贯彻十九...</a></p><span class="fr">-10-22</span> </div><div class="clearfix dynamics_text"><p class="fl"><a href="#">综合管理服务中心党支部学习贯彻十九...</a></p><span class="fr">-10-22</span> </div><div class="clearfix dynamics_text"><p class="fl"><a href="#">综合管理服务中心党支部学习贯彻十九...</a></p><span class="fr">-10-22</span> </div><div class="clearfix dynamics_text"><p class="fl"><a href="#">综合管理服务中心党支部学习贯彻十九...</a></p><span class="fr">-10-22</span> </div><div class="clearfix dynamics_text"><p class="fl"><a href="#">综合管理服务中心党支部学习贯彻十九...</a></p><span class="fr">-10-22</span> </div></div></div></div><!-- 赛事报名和动态结束 --> <!-- 经常呈现 --><div class="wonderful"><div class="w1200"><h1>精彩<span>呈现</span><i>/全民健身，为健康加油</i></h1><div class="wonderful_img"><ul class="clearfix"><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">全民瑜伽公益活动 <span>(10张)</span></a></p></li><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">全民瑜伽公益活动 <span>(10张)</span></a></p></li><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">全民瑜伽公益活动 <span>(10张)</span></a></p></li><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">全民瑜伽公益活动 <span>(10张)</span></a></p></li></ul></div></div></div><!-- 经常呈现结束 --> <!-- 场馆预订 --><div class="book w1200 clearfix"><div class="event book_title fl"><h1>场馆<span>预订</span><i>/全民健身，为健康加油</i></h1><div class="book_nav"><ul class="clearfix"><li><a href="#" class="on">全部</a></li><li><a href="#">游泳</a></li><li><a href="#">篮球</a></li><li><a href="#">足球</a></li><li><a href="#">网球</a></li><li><a href="#">乒乓球</a></li><li><a href="#">羽毛球</a></li><li><a href="#">瑜伽</a></li></ul></div><div class="book_img clearfix"><ul><li> <a href="#"><img src="picture/book_img.png" alt=""></a><h3><a href="#">宜昌市体育馆XXX羽毛球场</a></h3><p>西陵区西陵二路 18号</p><span>15525252525</span> </li><li> <a href="#"><img src="picture/book_img.png" alt=""></a><h3><a href="#">宜昌市体育馆XXX羽毛球场</a></h3><p>西陵区西陵二路 18号</p><span>15525252525</span> </li><li> <a href="#"><img src="picture/book_img.png" alt=""></a><h3><a href="#">宜昌市体育馆XXX羽毛球场</a></h3><p>西陵区西陵二路 18号</p><span>15525252525</span> </li></ul></div></div><div class="dynamics fr"><div class="dynamics_title clearfix"> <span class="fl">赛事直播</span> <a class="fr" href="javascript:;">more >></a> </div><div class="dynamics_constent nopbook"><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div><div class="clearfix book_text"> <a href="#">体育成主科，考不是目的！最终目的是素质教育！</a> </div></div></div></div><!-- 场馆预订结束 --> <!-- 全民健身组织 --><div class="wonderful"><div class="w1200"><h1 class="jians_icon">全民<span>健身组织</span><i>/全民健身，为健康加油</i></h1><div class="jias_groud clearfix"> <a class="active" href="javascript:;">市级体育协会</a> <a href="javascript:;">县区级体育协会</a> <a href="javascript:;">健身站点</a> </div><div class="wonderful_img"><ul class="clearfix jians_ul"><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">宜昌市体育馆羽毛球场</a></p></li><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">宜昌市体育馆羽毛球场</a></p></li><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">宜昌市体育馆羽毛球场</a></p></li><li> <a href="#"><img src="picture/wonderful_img.png" alt=""></a><p><a href="#">宜昌市体育馆羽毛球场</a></p></li></ul></div></div></div><!-- 全名健身组织结束 --> <!-- 社体指导员 --><div class="enrol instructor w1200 clearfix"><div class="event fl" id="event"><h1 class="instructor_icon">社体<span>指导员</span><i>/全民健身，为健康加油</i></h1><div class="instructor_type clearfix"> <span class="fl">运动类型:</span> <a class="active" href="javascript:;">全部</a> <a href="javascript:;">足球</a> <a href="javascript:;">羽毛球</a> <a href="javascript:;">游泳</a> <a href="javascript:;">自行车</a> <a href="javascript:;">桌球</a> <a href="javascript:;">徒步</a> <a href="javascript:;">徒步</a> <a href="javascript:;">乒乓球</a> </div><div class="slide-wrap"><ul class="slide-img"><li><div class="event_content clearfix"><div class="one_event instructor_constent fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div><div class="one_event instructor_constent fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div></div><div class="event_content clearfix"><div class="one_event instructor_constent fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div><div class="one_event instructor_constent fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div></div></li><li><div class="event_content clearfix"><div class="one_event instructor_constent fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div><div class="one_event instructor_constent fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div></div><div class="event_content clearfix"><div class="one_event instructor_constent fl clearfix"><a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div><div class="one_event instructor_constent fl clearfix"> <a href="#"><img class="fl" src="picture/one_event_icon.png" alt=""></a><div class="fr event_detail"><p>姓名：张飞鹏</p><p>级别：国家一级武术裁判 </p><p>城市：湖北宜昌 </p><p>指导项目：武术</p></div></div></div></li></ul><ul class="slide-tab"><li class="slide-tab-on"></li><li class=""></li></ul></div></div><div class="dynamics fr"><div class="dynamics_title clearfix"> <span class="fl">体质健康</span> </div><div class="dynamics_constent instructor_tab"><table border="1"><tr><td><a href="#"><img src="picture/tab1.png" alt=""></a><p>健身锻炼法</p></td><td><a href="#"><img src="picture/tab2.png" alt=""></a><p>健身锻炼法</p></td><td><a href="#"><img src="picture/tab3.png" alt=""></a><p>健身锻炼法</p></td></tr><tr><td class="active"><a href="#"><img src="picture/tab4.png" alt=""></a><p>健身锻炼法</p></td><td><a href="#"><img src="picture/tab5.png" alt=""></a><p>健身锻炼法</p></td><td><a href="#"><img src="picture/tab6.png" alt=""></a><p>健身锻炼法</p></td></tr><tr><td><a href="#"><img src="picture/tab7.png" alt=""></a><p>健身锻炼法</p></td><td><a href="#"><img src="picture/tab8.png" alt=""></a><p>健身锻炼法</p></td><td><a href="#"><img src="picture/tab9.png" alt=""></a></td></tr></table></div></div></div><!-- 社体指导员结束 --> </div><!-- 内容区域 --> <!-- fooder区域 --><div class="fooder"><div class="food_content w1200"><div class="food_top clearfix"><div class="fl food_logo"> <img src="picture/food_logo.png" alt=""><p>宜昌全民健身公共服务平台是宜昌市体育局建设的公共服务类的体育综合平台，该平台集成了国民体质监测预约、活动赛事场馆在线预订、体育指导员展示、科学健身指导、全民健身服务设施GIS平台，解决了群众日常的体育锻炼需求，该平台将如何健身锻炼、在哪里健身锻炼、科学评估锻炼效果等多维度的服务融合，将提升我区居民的科学健身、体育锻炼、赛事参与等体育运动的热情，促进我市居民体质健康。</p></div><div class="fr clearfix"><div class="fl er_ma"> <img src="picture/er.png" alt=""><p>宜昌体育</p></div><div class="fl er_ma"> <img src="picture/er.png" alt=""><p>运动宜昌</p></div><div class="fl er_ma"> <img src="picture/er.png" alt=""><p>网易新闻</p></div></div></div></div><div class="address">主办单位：宜昌市体育局 运营单位：网易新闻宜昌运营中心 </div></div><!-- fooder区域结束 --></body><script>$(function(){$(".jias_groud a").click(function(){$(this).addClass("active").siblings().removeClass("active")})})</script></html>
四、获取更多源码
PC电脑端关注我们
五、学习资料
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
六、更多源码
PC电脑端关注我们
HTML5期末考核大作业源码* 包含个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
HTML+CSS网页设计期末课程大作——绿色精美全民健身网站(10页) dreamweaver作业静态HTML网页设计模板
