HTML5期末大作业:网页制作代码 网站设计——人电影网站(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 dreamweaver作业静态HTML网页设计模板
常见网页设计作业题材有
个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他
等网页设计题目,A+水平作业
, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
🧡作者主页-更多源码
🧡HTML期末大作业文章专栏
作品介绍
1.网页作品简介
:HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局。
2.网页作品编辑
:作品下载后可使用任意HTML编辑软件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++
等任意HTML软件编辑修改网页)。
3.网页作品技术
:Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了logo(源文件),基本期末作业所需的知识点全覆盖。
文章目录
- HTML5期末大作业:网页制作代码 网站设计——人电影网站(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 dreamweaver作业静态HTML网页设计模板
- 作品介绍
- 一、作品展示
- 二、文件目录
- 三、代码实现
- 四、学习资料
- 五、完整源码
- 六、更多源码
一、作品展示
二、文件目录
三、代码实现
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>电影播放</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<center>
<nav class="navbar navbar-default " role="navigation">
<div class="container-fluid ">
<div class="navbar-header">
<a class="navbar-brand" href="#">电影网LOGO</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="register.html"><span class="glyphicon glyphicon-user"></span> 注册</a>
</li>
<li>
<a href="#"><span class="glyphicon glyphicon-log-in"></span> 登录</a>
</li>
</ul>
</div>
</nav>
<div style="width: 75%; min-width: 1150px;max-width: 1320px;">
<nav class="navbar navbar-inverse navbar-static-top " role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="index.html">首页</a>
</div>
<div>
<ul class="nav navbar-nav">
<li>
<a href="#">电影</a>
</li>
<li>
<a href="#">音乐MV</a>
</li>
<li>
<a href="#">视频短片</a>
</li>
<li>
<a href="#">公开课</a>
</li>
</ul>
<div class="clear">
<form class="navbar-form navbar-right" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="输入电影名称...">
</div>
<button type="submit" class="btn btn-default ">搜索电影</button>
</form>
</div>
</div>
</div>
<div class="container-fluid navbar-default ">
<div>
<ul class="nav navbar-nav">
<li>
<a href="#">2019电影</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>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="#">评分最高</a>
</li>
<li>
<a href="#">最热门</a>
</li>
</ul>
</div>
</div>
</nav>
<!--电影详情-->
<div class="col-lg-9">
<div class="media">
<div class="media-left media-top">
<div class="media-object" style="width: 600px;">
<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9 ">
<iframe class='embed-responsive-item ' src="img/view.mp4" allowtransparency="true" allowfullscreen="true" allowfullscreenInteractive="true" scrolling="no" border="0" frameborder="0">
</iframe>
</div>
</div>
<!--<img src="img/001.jpg" class="media-object" style="width:600px">-->
</div>
<div class="media-body text-left">
<div>
<h4>反贪风暴4(2019)</h4>
<small>HD1280高清国语|粤语中字版 </small>
</div>
<hr />
<p>别名:P Storm</p>
<p>演员:<a href="#">古天乐</a><a href="#"> 林家栋</a><a href="#"> 郑嘉颖 </a><a href="#"> 林峯 </a></p>
<p>导演:<a href="#">林德禄</a> </p>
<div style="width: 200px;">
<div class="pull-left">类型:动作</div>
<div class="pull-right">语言:国语</div>
</div>
<div style="width: 200px;">
<div class="pull-left">地区:香港</div>
<div class="pull-right">片长: 100</div>
</div>
</div>
<div class="text-left">
<h4>影片简介</h4>
<small>廉政公署收到报案人廖雨萍(周秀娜饰)的实名举报,举报正在坐牢的富二代曹元元(林峯饰)涉嫌行贿监狱里的监督沈济全(谭耀文饰)以及惩教员,首席调查主任陆志廉(古天乐饰)决定深入虎穴,卧底狱中。在监狱里,被陆志廉送入监狱的前警司黄文彬(林家栋饰)以及曹元元两大帮派势成水火,陆志廉趁机接近曹元元取得信任。同时监狱外的廉政公署总调查主任程德明(郑嘉颖饰)、国内反贪局行动处处长洪亮(丁海峰饰)也陆港联手,通力合作,最终成功破获贪腐行贿大案。</small>
</div>
</div>
<hr>
<!--猜您喜欢-->
<a href="#" class="navbar-left"><span class="glyphicon glyphicon-film"></span> 猜您喜欢</a><br />
<hr />
<table class="table table-bordered text-center" >
<thead>
<tr>
<th><a href="#"><img src="img/001.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/002.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/003.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/004.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/005.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="#">反贪风暴4</a></td>
<td><a href="#">复仇者联盟4:终局之战</a></td>
<td><a href="#">大黄蜂</a></td>
<td><a href="#">惊奇队长</a></td>
<td><a href="#">X战警:黑凤凰</a></td>
</tr>
</tbody>
</table>
<table class="table table-bordered text-center" >
<thead>
<tr>
<th><a href="#"><img src="img/001.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/002.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/003.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/004.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
<th><a href="#"><img src="img/005.jpg" class="img-thumbnail" alt="Cinque Terre"></a></th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="#">反贪风暴4</a></td>
<td><a href="#">复仇者联盟4:终局之战</a></td>
<td><a href="#">大黄蜂</a></td>
<td><a href="#">惊奇队长</a></td>
<td><a href="#">X战警:黑凤凰</a></td>
</tr>
</tbody>
</table>
</div>
<div class="col-lg-3">
<ul id="myTab" class="nav nav-tabs">
<li class="active"><a href="#zjgx" data-toggle="tab">
相关影片</a></li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade in active" id="zjgx">
<ul class="list-group ">
<li class="list-group-item"><span class="badge">热</span>[综艺] 心动的信号第二季</li>
<li class="list-group-item"><span class="badge">热</span>[动漫] 贤惠仙狐小姐</li>
<li class="list-group-item"><span class="badge">热</span>[大陆剧] 铁血茶城</li>
<li class="list-group-item">[大陆剧] 爱是欢乐的源泉</li>
<li class="list-group-item">[大陆剧] 少年派</li>
<li class="list-group-item">[外语] 阿涅斯论瓦尔达</li>
<li class="list-group-item">[大陆剧] 铁血茶城</li>
<li class="list-group-item">[大陆剧] 爱是欢乐的源泉</li>
<li class="list-group-item">[大陆剧] 少年派</li>
<li class="list-group-item">[外语] 阿涅斯论瓦尔达</li>
<li class="list-group-item">[大陆剧] 铁血茶城</li>
<li class="list-group-item">[大陆剧] 爱是欢乐的源泉</li>
<li class="list-group-item">[大陆剧] 少年派</li>
<li class="list-group-item">[外语] 阿涅斯论瓦尔达</li>
</ul>
</div>
</div>
</div>
</div>
</center>
</body>
</html>
四、学习资料
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
五、完整源码
【百度网盘-源码下载地址】
链接:https://pan.baidu/s/1T5XeFJ7WE2ASbylHE2sRMA
提取码:8888
六、更多源码
HTML5期末考核大作业源码
* 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他
可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
更多推荐
HTML5期末大作业:网页制作代码 网站设计——人电影网站(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 dreamweaver作业
发布评论