静态网页设计——电影角(HTML+CSS+JavaScript)

前言

声明:该文章只是做技术分享,若侵权请联系我删除。!!

使用技术:HTML+CSS+JS
主要内容:本网页主要利用HTML语言编写,简要介绍世界上一些主要国家,例如,中,英,法,美等。他们的电影发展史以及一些该国较为具有代表性的电影,另外还科普了一些拍摄电影经常使用的方法,以及该方法所起到的作用。该网站仅仅是较为简单地利用文字进行简要叙述。

主要内容

本网站使用的是局部刷新技术,所以主要看右下角的差异。使用的技术是ajax。

1、主页

主页以红黑色调来修饰背景。左下角列出了奥斯卡十大经典电影。整体结构以HTML进行布局,使用css进行样式设计。
在这里插入图片描述

部分代码如下:

<div class="box info"><h1><font color="#000000">奥斯卡十大经典电影</font></h1>卡萨布兰卡<br />阿拉伯的劳伦斯<br />教父<br />飞越疯人院<br />ANNIE HALL<br />西边故事<br />不可饶恕<br />午夜牛郎<br />关于女人的一切<br />指环王:王者归来 <br /></div>
2、中国电影

中国电影页面主要介绍了中国电影的发展史,和一些比较有名和经典的中国电影。我们可以将文字替换成自己喜欢的电影等等。
在这里插入图片描述

部分代码如下:

<div id="right_column"><h1>中国电影</h1><p class="text_area box info">中国电影诞生于1905年,北京丰泰照相馆创办人任景丰拍摄了由谭鑫培主演的《定军山》片断,这是中国人自己摄制的第一部影片。1896年8月11日,上海徐园内的又一村放映“西洋影戏”,是中国第一次电影放映。粉碎四人帮后,电影事业获得发展。1977年电影生产开始复苏,1980~1984年平均年产量达120部左右,每年观众人次平均在250亿左右,中国电影进入一个蓬勃发展的新时期。年,中国电影年产量高达500余部,全年总票房超过100亿人民币。 <br /></p><p  class="box info">中国第一部电影是戏曲片京剧《定军山》,内有《请缨》《舞刀》等片断,1905年(清光绪三十一年),由北京丰泰照相馆摄制。无声片,长约半小时。<br /><br /> 中国第一部故事片是《难夫难妻》,1913年在上海拍摄,无声片,郑正秋编剧,郑正秋和张石川联合导演。<br /><br />中国第一部有声电影是《歌女红牡丹》,明星影片公司1931年摄制。<br /><br />中国第一部获得国际大奖的影片是20世纪30年代由蔡楚生导演的《渔光曲》,它在1935年莫斯科国际电影节上获“荣誉奖”。<br /><br />中国第一部彩色电影是1948年拍摄于上海的戏曲片《生死恨》,由华艺影片公司出品。费穆导演,主演梅兰芳,著名摄影师黄绍芬为摄影指导,李生伟任摄影师。<br /><br />新中国成立后第一部故事片是《桥》,编剧于敏,导演王滨,东北电影制片厂1949年摄制。<br /><br />中国第一部彩色故事片是1957年拍的《祝福》(鲁迅著,夏衍改编,桑弧导演),北京电视制片厂摄制。<br /><br />中国第一部彩色宽银幕故事片是1959年拍的《老兵新传》,编剧李准,导演沈浮,上海海燕电影制片厂摄制。<br /><br />中国第一部彩色立体宽银幕故事片是1962年拍的《魔术师的奇遇》,编剧:王栋、陈恭敏、桑弧,导演桑弧,上海天马电影制片厂摄制。<br /><br />中国第一部彩色舞台纪录片是1954年拍的《梁山伯与祝英台》,编剧:徐进、桑弧,导演桑弧,上海电影制片厂摄制。<br /><br />中国第一部遮幅式宽银幕故事片是1977年拍的《青春》,李云官、王炼编剧,谢晋导演。<br /><br />新中国成立后的第一部译制片是《团的儿子》,原译名《小英雄》,杨范、陈涓翻译,周彦译制导演,上海电影制片厂1950年译制。<br /><br />中国与外国合拍的第一部彩色故事片是1958年由北京电影制片厂与法国加朗斯公司合摄的《风筝》,导演王家乙、罗歇·比果。<br /><br />中国第一部获得法国戛纳国际电影节最高奖项“金棕榈大奖”的电影是《霸王别姬》,导演陈凯歌。 <br /><br /></p></div>
3、英国电影

英国电影页面主要介绍了英国电影的发展史,和一些比较有名和经典的英国电影。我们可以把文字替换成自己喜欢的电影等等。
在这里插入图片描述

部分代码如下:

<div id="right_column"><h1>英国电影</h1><p class="text_area box info">其实在英国电影发展史的一百多年中,布赖顿学派、纪录电影运动、自由电影运动等都为世界影坛贡献了巨大的精神财富。英国电影学院《画面与音响》杂志的十佳电影排名更是专业电影人所信赖的最高标准。每年,英国出产超过90部影片,产值高达8亿英镑,其中既包括自产影片,也包括海外合作片。优秀的导演、出色的演员、高技巧的电影拍摄技术和吸引人的电影主题使得英国电影已经成为世界电影界的佼佼者。 <br /></p><p  class="box info">对英国早期电影最有影响的是布赖顿的几位摄影师。其中有E.柯林斯、A.G.史密斯、J.威廉森等,这几位电影先驱,后来被人称为布赖顿学派。他们最早采用了两次曝光、移动摄影、迭印、全景、倒拍、停拍等技巧。柯林斯拍过30部影片,其中只有一部《中断的旋律》保存下来。史密斯在《祖母的放大镜》(1900)中采用特大特写镜头,银幕上出现了放大的走动的表、笼中的金丝雀、人的眼睛;他的第一部作品《夜晚》,表现警察提着灯巡夜,沿路照亮了乞丐、醉汉、行窃的小偷,他用摄影机代替人的眼睛,把它变成了活的东西,这种新的手法,可以说是现代蒙太奇的开端。威廉森则在新闻片中自由地交替变换事件地点并采用外景等,他的《士兵的归来》和《战前和战后的后备兵》两部影片,描绘了真实生活片断,在银幕上首次提出社会问题。<br /><br />当时的电影艺术家和技术革新家还有C.赫普沃思。1897年,他撰写的《活动摄影术──或电影摄影入门》,是世界上最早电影论著之一。他曾改进冲洗影片器具、印片机和胶片打孔机。1898年他拍摄了《铁路切断中的快车》;接着拍摄的《艾丽斯漫游奇境记》(1903),长800英尺,分16场景,场景间交融衔接;另一部《浪子救人》(1905)利用摄影机述说故事,结构复杂,采取了分镜头剧本的串联、剪辑、摇拍、低角度摄影等技巧;1907年,他还设计过录音系统。同一时期摄制故事片的还有F.S.莫特肖。他的 《抢劫邮车》、《白昼行劫》(两部影片均摄于1903年)奠定了惊险片在英国的地位。<br /><br />早期英国电影除纪录像片和故事片外,还出现了风景片,如G.潘廷格的《罗伯特·斯科特漫游南极》(1913),颇受欢迎。1914年,英国电影工作者制作了第一部动画片。G.皮尔逊导演的《血字的研究》是根据小说《福尔摩斯探案》中的故事拍摄的第一部侦探片;他的另一部影片《厄尔塔斯──死里逃生的人》(1916),则仿照法国影片《芳托马斯》样式,是第一套动作惊险连续片集。 <br /><br /></p></div>
3、登录注册页面

展现了登录注册的表单。使用from表单进行实现,只是显示前端效果,因为这是静态网页,所以后台的逻辑是没办法实现的,抱歉。
在这里插入图片描述

在这里插入图片描述

总结

想要看具体效果的同学,可以访问这个链接:
https://www.bilibili.com/video/BV1CT4y1H7eY/?vd_source=5f425e0074a7f92921f53ab87712357b
具体的代码也在该链接下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/231347.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

STM32通用定时器-输入捕获-脉冲计数

一、知识点 编码器   两相编码器&#xff08;正交编码器&#xff09;&#xff1a;两相编码器由 A 相和 B 相组成&#xff0c;相位差为 90 度。当旋转方向为顺时针时&#xff0c;A 相先变化&#xff0c;然后 B 相变化&#xff1b;当旋转方向为逆时针时&#xff0c;B 相先变化…

前端页面锚点跳转

一&#xff0c;页面 二&#xff0c;获取需要跳转的标签class或者id 三&#xff0c;调用跳转方法 如果你的标签有唯一的ID&#xff0c;那么用getElementById方法更好 点击即可跳转锚点

DDIA 第十一章:流处理

本文是《数据密集型应用系统设计》&#xff08;DDIA&#xff09;的读书笔记&#xff0c;一共十二章&#xff0c;我已经全部阅读并且整理完毕。 采用一问一答的形式&#xff0c;并且用列表形式整理了原文。 笔记的内容大概是原文的 1/5 ~ 1/3&#xff0c;所以你如果没有很多时间…

Python爬虫实战技巧:如何在爬取过程中动态切换代理IP

目录 前言 第一步&#xff1a;获取代理IP列表 第二步&#xff1a;测试代理IP的可用性 第三步&#xff1a;动态切换代理IP 总结 前言 在进行爬虫开发的过程中&#xff0c;有时候需要使用代理IP来访问目标网站&#xff0c;以避免被封IP或者降低访问频率的限制。本文将介绍如…

gem5学习(8):创建一个简单的缓存对象--Creating a simple cache object

目录 一、SimpleCache SimObject 二、Implementing the SimpleCache 1、getSlavePort() 2、handleRequest() 3、AccessEvent() 4、accessTiming() &#xff08;1&#xff09;缓存命中&#xff1a;sendResponse() &#xff08;2&#xff09;缓存未命中&#xff1a; 三、…

数据分析-25-电商用户行为可视化分析

文章目录 0. 数据代码获取1. 项目介绍1.1 分析背景1.2 分析目的1.3 分析思路 2. 数据清洗2.1 加载必要的库2.2 读取数据2.3 统计缺失值2.4 处理数据a. 删除重复值b. 转换时间格式c. 提取日期和时间d. 转换数据类型 3. 分析内容3.1 用户活跃规律a. 日均pv与uvb. 日新增pv、uv趋势…

Linux 修改主机名称并通过主机名称访问服务器

一、命令提示符简介 当我们打开终端的时候&#xff0c;我们要输入命令的左边就是命令提示符&#xff0c;如下图&#xff0c;接下来介绍下他们分别代表什么含义 1、root 和 xhf 表示的是当前登录的用户名称。 2、node2 表示的当前的主机名称。 3、~ 表示的是当前的目录 4、# 表示…

Plantuml之甘特图语法介绍(二十八)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

柯桥职场英语中千万别把英文邮件中的“OOO”理解成“哦哦哦”!不然可就尴尬了!

有的同学工作中跟老外打交道比较多 尤其是写邮件&#xff0c;除了要把事情交代清楚 还有一些缩写我们也必须掌握 就拿发邮件时老外最爱用到的“OOO”来说 千万不要把“OOO”理解成“噢噢噢” 今天给大家分享几个关于邮件的常用表达 它们真正的意思你都知道吗 01 “OOO”可…

014、枚举与模式匹配

枚举类型&#xff0c;通常也被简称为枚举&#xff0c;它允许我们列举所有可能的值来定义一个类型。在本篇文章中&#xff0c;我们首先会定义并使用一个枚举&#xff0c;以向你展示枚举是如何连同数据来一起编码信息的。 接着&#xff0c;我们会讨论一个特别有用的枚举&#xff…

Minitab 21软件安装包下载及安装教程

Minitab 21下载链接&#xff1a;https://docs.qq.com/doc/DUkNHZVhwTXhtTFla 1.选中下载好的安装包&#xff0c;鼠标右键解压到”Minitab 21“文件夹 2.选中”Setup.exe“&#xff0c;鼠标右击选择“以管理员身份运行” 3.点击“下一步” 4.点击“是” 5.点击“下一步” 6.勾选…

ChatGPT绘制全球植被类型分布图、生物量图、土壤概念图、处理遥感数据并绘图、病毒、植物、动物细胞结构图

以ChatGPT、LLaMA、Gemini、DALLE、Midjourney、Stable Diffusion、星火大模型、文心一言、千问为代表AI大语言模型带来了新一波人工智能浪潮&#xff0c;可以面向科研选题、思维导图、数据清洗、统计分析、高级编程、代码调试、算法学习、论文检索、写作、翻译、润色、文献辅助…

信息系统安全——缓冲区溢出和恶意代码分析

实验 1 缓冲区溢出和恶意代码分析 1.1 实验名称 《缓冲区溢出和恶意代码分析》 1.2 实验目的 1 、熟练使用恶意代码分析工具 OD 和 IDA 2 、通过实例分析&#xff0c;掌握缓冲区溢出的详细机理 3 、通过实例&#xff0c;熟悉恶意样本分析过程 1.3 实验步骤及内容 第一阶段&…

ClickHouse基础知识(五):ClickHouse的SQL 操作

基本上来说传统关系型数据库&#xff08;以 MySQL 为例&#xff09;的 SQL 语句&#xff0c;ClickHouse 基本都支持&#xff0c; 这里不会从头讲解 SQL 语法只介绍 ClickHouse 与标准 SQL&#xff08;MySQL&#xff09;不一致的地方。 1. Insert 基本与标准 SQL&#xff08;My…

71内网安全-域横向网络传输应用层隧道技术

必备知识点&#xff1b; 代理和隧道技术的区别&#xff1f; 代理主要解决的是网络访问问题&#xff0c;隧道是对过滤的绕过&#xff0c; 隧道技术是为了解决什么 解决被防火墙一些设备&#xff0c;ids&#xff08;入侵检测系统&#xff09;进行拦截的东西进行突破&#xff0…

迪杰斯特拉(Dijkstra)算法详解

【专栏】数据结构复习之路 这篇文章来自上述专栏中的一篇文章的节选&#xff1a; 【数据结构复习之路】图&#xff08;严蔚敏版&#xff09;两万余字&超详细讲解 想了解更多图论的知识&#xff0c;可以去看看本专栏 Dijkstra 算法讲解&#xff1a; 迪杰斯特拉算法(Di…

pip install skopt安装显示没有对应版本问题及解决

一、问题描述以及分析 &#xff08;一&#xff09;问题描述 ModuleNotFoundError: No module named skopt pip install skopt Note: you may need to restart the kernel to use updated packages.ERROR: Could not find a version that satisfies the requirement skopt (fro…

C语言编译器(C语言编程软件)完全攻略(第十三部分:VS2010使用教程(使用VS2010编写C语言程序))

介绍常用C语言编译器的安装、配置和使用。 十三、VS2010使用教程&#xff08;使用VS2010编写C语言程序&#xff09; 提示&#xff1a;VS2010 可以在 XP、Win7 和 Win8 下完美运行&#xff0c;但在 Win10 下可能会有兼容性问题&#xff0c;使用 Win10 的读者建议安装 VS2015 或…

JDBC练习查询所有内容

MySql表代码 -- 删除tb_brand表 drop table if exists tb_brand; -- 创建tb_brand表 create table tb_brand (-- id 主键id int primary key auto_increment,-- 品牌名称brand_name varchar(20),-- 企业名称company_name varchar(20),-- 排序字段ordered int…

解决VNC连接Ubuntu服务器打开终端出现闪退情况

服务器环境 阿里云ECS服务器 操作系统&#xff1a;Ubuntu 20.0.4 如何使用VNC连接阿里云ECS服务器 1.阿里云官方指导&#xff1a;通过VNC搭建Ubuntu 18.04和20.04图形界面 2.新手入门ECS——ubuntu 20.04安装图形化界面和本地VNC连接 问题描述 使用VNC连接上新申请阿里云服…