简单的html+CSS+JS搭建电影网页

最新推荐文章于 2024-03-20 12:53:49 发布
最新推荐文章于 2024-03-20 12:53:49 发布
阅读量1.2k 收藏 28
点赞数 21
文章标签： javascript 前端 html5 Powered by 金山文档
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_74031986/article/details/129270121
版权

一.网页构成

1.登录注册界面

2.导航栏

3.轮播图

4.滚动照片和滚动字体设置

5.电影图片+超链接+排版

二.界面+代码展示

  1. 登录注册界面展示

代码展示：

<!doctype html>

<html lang="zh-CN">

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Bootstrap 101 Template</title>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"

integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

<script>

function fun()

{

alert("注册成功！！");

location.href="/登录界面.html";

}

</script>

</head>

<body style="background: #1a1e21">

<div class="row" style="background-image: url(登录背景图.png)">

<br>

<div class="col-sm-8 col-sm-offset-2" style="border:5px solid black;background: #c5d7f2">

<div class="row">

<br><br><br><br><br><br><br><br>

<div class="row-cols-sm-8">

<font color="black"size="100px" >&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;

&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 会员注册<br><br></font>

<form class="form-horizontal" οnsubmit="fun()">

<div class="form-group">

<label for="username" class="col-sm-2 control-label">用户名</label>

<div class="col-sm-8">

<input type="text" class="form-control" id="username"name="username" placeholder="请输入用户名">

</div>

</div>

<div class="form-group">

<label for="password" class="col-sm-2 control-label">密码</label>

<div class="col-sm-8">

<input type="password" class="form-control" id="password" name="password" placeholder="请输入密码">

</div>

</div>

<div class="form-group">

<label for="rpassword" class="col-sm-2 control-label">确认密码</label>

<div class="col-sm-8">

<input type="password" class="form-control" id="rpassword" name="rpassword" placeholder="请再次输入密码">

</div>

</div>

<form class="form-horizontal">

<div class="form-group">

<label for="email" class="col-sm-2 control-label">邮箱</label>

<div class="col-sm-8">

<input type="email" class="form-control" id="email" name="email" placeholder="请输入email">

</div>

</div>

<div class="form-group">

<div class="col-sm-offset-2 col-sm-8">

<div class="checkbox">

<label>

<input type="checkbox"> 记住我

</label>

</div>

</div>

</div>

<div class="form-group">

<div class="col-sm-offset-2 col-sm-8">

<button type="button" class="btn btn-default" oncancel="fun()" οnclick="window.location.href='登录界面2.html'">注册</button>

</div>

</div>

</form>

</div>

</div>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

</div>

</div>

</body>

</html>>

登录界面：

  1. 导航栏

  1. 轮播图

js部分：

CSS部分：

4.滚动文字和照片

<marquee scrollamount=20>

<img src="海贼王.png"height="300px">

<img src="1.png"height="300px">

<img src="2.png"height="300px">

<img src="3.png"height="300px">

<img src="4.png"height="300px">

<img src="5.png"height="300px">

<img src="6.png"height="300px">

</marquee>

5.电影图片+超链接+排版

部分代码展示：

其他影厅类似，暂不展示！！

ngW_xuan
关注
  • 21
    点赞
  • 踩
  • 28
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
制作一个简单HTML电影网页设计（HTML+CSS）
08-10
HTML5期末考核大作业源码 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞 蹈、 动漫、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、游戏、 节日、 戒烟、 电影、 摄影、 文化、 家 乡、 鲜花、 礼品、 汽车、 其他 可满足大学生网页大作业网页设计作业需求, 喜欢的可以下载! 原生(HTML+CSS+JS),网页作品代码简单,可使用任意HTML编辑软件（如：`Dreamweaver、HBuilder、Vscode 、Sublime 、 Webstorm、Text 、Notepad++` 等任意html编辑软件进行运行及修改编辑等操作） HTML静态网页设计作业，采用DIV+CSS布局，共有多个页面，使用CSS排版比较丰富，色彩鲜明有活力,顶部导航及底部 区域背景色为100%宽度。都是给学生定制的都符合学生考试期末作业的水平,有的有js，有的视频+音乐+flash的等 元素的插入。 【查看更多源码地址】：https://blog.csdn.net/VX_WJ88950106?type=blog
HTML+CSS+JS制作一个迅雷看看电影网页设计实例 ，排版整洁，内容丰富，主题鲜明，简单的网页制作期末作业
网页设计与制作
12-03 286
1 网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。2.网页编辑：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑
20. Web前端网页制作 超级英雄电影主题网页设计实例 大学生期末大作业 html+css+js
A240307的博客
03-20 969
本文以“电影”欧美电影超级英雄为主题设计，本实例系统文件种类包含：html、css、js网页样式文件。应用DIV、点击事件等，供大家参考。 【关注作者|获取更多源码（2000+个Web案例源码）|优质文章】；您的支持是我创作的动力！看到这里就【点赞收藏博文】，三连支持下吧，3Q！有兴趣的联系我交流分享！
如何用HTML+CSS+JavaScript实现一个简单的电影网站页面
weixin_51980608的博客
05-17 4552
做一个页面，首先我们要先规划好怎样布局，我做的时候，先用div标签将页面的每个部分做好了布局，之后通过position来设置具体的盒子布局，之后再添加盒子的内容。 话不多说，上源码。 HTML部分 <!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="main.css" type="text/css"> <script type="text/jav
HTML期末学生大作业-在线电影网站html+css+javascript
学生期末作业
06-15 1万+
html网页制作期末大作业--电影网站html+css+javascript 5个页面适用学生作业课程设计在线电影影网、期末作业电影网、毕业设计在线电影网 部分页面截图 部分源代码 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>叮当电影 - 搜罗全网好电影</title> &lt...
div+css网页html成品学生作业包含10个html页面——动漫主题海贼王
QQ_____365392777的博客
08-10 4752
1 网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。2.网页编辑：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑
静态电影网站模板A(html+css+js)
weixin_46402939的博客
07-21 2946
【代码】静态电影网站模板A(html+css+js)
html+css+js制作简单网站首页
weixin_44752434的博客
07-28 2万+
一个简单的网站主页 主要由html+css+js制作 1.图片展示 这是首页的上半部分，主要内容有：顶部标头、顶部导航栏、图片轮播图。 这是首页的下半部分，主要内容有：首页主要内容、底部。 2.代码展示 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>我们的恋爱小屋</title> <embe
HTML+CSS+JS大作业——新能源汽车资讯门户(11页) web前端设计与开发期末作品/期末大作业
12-04 244
HTML+CSS+JS大作业——新能源汽车资讯门户(11页) web前端设计与开发期末作品/期末大作业 常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载! 获取更多源码 PC电脑端关
HTML+CSS+JS构建的电商网站页面（源码）
07-14
用HTML+CSS+JS构建的电商网站页面平台（完整代码），web前端CSS入门项目。简易读懂，适合学生以及课程报告参考用。
HTML+CSS+JavaScript搭建动态个人网站
08-05
你是否想要学习前端开发，并用 HTML, CSS 和 JavaScript 创建一个简洁而...如果你想要学习前端开发，并用 CSS+HTML+JAVASCRIPT 创建一个漂亮而实用的个人网页，那么请不要犹豫，点击下面的链接，开始你的学习之旅吧！
html+css+js网页设计.pdf
最新发布
05-14
当涉及到使用HTML、CSS和JavaScript进行网页设计时，我们需要从基础开始，逐步构建出一个功能丰富且用户友好的网站。以下是一个关于如何使用这三种技术来创建网页的详细步骤和解释。 1. 规划和设计 在开始编写代码...
京东首页Html+css+javascript代码
04-15
用前端三语言简单实现京东首页搭建，实现了导航栏和轮播图功能，对购物网站搭建框架有了基本的了解。
使用HTML和CSS搭建网页.zip
12-14
基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于...
HTML+CSS大作业 电影网站设计——电影介绍(11页) 大学生电影网页作品 电影网页设计作业模板 学生网页制作源代码下载
qq_524614081的博客
06-16 994
HTML5期末大作业：电影网站设计——电影介绍(11页) 大学生电影网页作品 电影网页设计作业模板 学生网页制作源代码下载 常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载! 作品介
HTML期末学生作业~HTML+CSS+JavaScript仿猫眼电影在线网站
热门推荐
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
06-18 3万+
❤ HTML期末学生作业~html+css+javascript仿猫眼电影在线网站(功能齐全) web期末结课大作业 html+css+javascript网页、电影、仿京东、天猫、服装、 企业网站制作，资源里面有网页的HTML文件、CSS文件、JAVASCRIPT文件和网页中的图片文件，用于大学web网页课程参考以及相关从业人员参考学习 ❉ 文章目录 ❤ HTML期末学生作业~html+css+javascript仿猫眼电影在线网站(功能齐全)❉ 一、介绍❉ 二、实现❉ 三、效果 2.效果
基于html+css+js的电影网站设计
05-28
设计一个基于HTML+CSS+JS的电影网站，需要进行以下步骤： 1. 确定网站的整体风格和设计风格，包括色彩、布局、字体等。 2. 设计网站的页面结构，确定需要包含哪些页面，如首页、电影列表页、电影详情页等。 3. ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值