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

news2024/11/16 20:56:19

前言

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

使用技术: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.coloradmin.cn/o/1359643.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

从马尔可夫奖励过程到马尔可夫决策到强化学习【02/2】

一、说明 随着 Open AI 于 2023 年 11 月 6 日发布GPT 代理&#xff0c;我们所有人都对它带来的支持和灵活性着迷。想象一下&#xff0c;有一个个性化的数字助手始终在您身边&#xff0c;根据您的喜好完成日常平凡任务或艰巨任务。但为这些定制代理提供动力的是强化学习&#x…

厚积薄发11年,鸿蒙究竟有多可怕

12月20日中国工程院等权威单位发布**《2023年全球十大工程成就》。本次发布的2023全球十大工程成就包括“鸿蒙操作系统”在内。入围的“全球十大工程成就”&#xff0c;主要指过去五年由世界各国工程科技工作者合作或单独完成且实践验证有效的&#xff0c;并且已经产生全球影响…

指针数组做main函数的形参

目录 ​编辑 1. 指针数组 1.1 基本概念 1.2 简单示例 2. 指针数组做main形参 2.1 int main(int argc, char *argv[]); 2.2 简单示例 1. 指针数组 1.1 基本概念 指针数组是指一个数组&#xff0c;其中的每个元素都是指针。 这意味着数组中的每个元素都存储一个地址&…

啊哈c语言——逻辑挑战8:验证哥德巴赫猜想

上面这封书信是普鲁士数学家哥德巴赫在1742年6月7日写给瑞士数学家欧拉的&#xff0c;哥德巴赫在书信中提出了“任一大于2的整数都可以写成3个质数之和”的猜想。当时&#xff0c;哥德巴赫遵照的是“1也是素数”的约定。现今&#xff0c;数学界已经不使用这个约定了。哥德巴赫原…

LLM增强LLM;通过预测上下文来提高文生图质量;Spikformer V2;同时执行刚性和非刚性编辑的通用图像编辑框架

文章首发于公众号&#xff1a;机器感知 LLM增强LLM&#xff1b;通过预测上下文来提高文生图质量&#xff1b;Spikformer V2&#xff1b;同时执行刚性和非刚性编辑的通用图像编辑框架 LLM Augmented LLMs: Expanding Capabilities through Composition 本文研究了如何高效地组…

vmware虚拟机安装esxi7.0步骤

一、安装准备 1、下载镜像文件 下载链接&#xff1a;https://pan.baidu.com/s/12XmWBCI1zgbpN4lewqYw6g 提取码&#xff1a;mdtx 2、vmware新建一个虚拟机 2.1 选择自定义 2.2 选择ESXi对应版本 2.3 选择稍后安装操作系统 2.4 默认选择 2.5 自定义虚拟机名称及存储位置 2…

手机与电脑投屏互联方案

手机 to 电脑 无线显示器 搜索"无线显示器"找到系统自带的应用 没有的话, 可能需要安装一下 电脑上打开无线显示器 手机中打开投屏 就投上去了, 感觉很卡, 不是很流畅,但是是系统自带的功能, 比较方便 无法连接时可以检查一下这里的设置 scrcpy screen copy 屏幕…

透明OLED屏制作:工艺与技术挑战

透明OLED屏作为一种前沿的显示技术&#xff0c;其制作过程涉及一系列复杂的工艺和技术挑战。作为一名专注于OLED技术研发的工程师&#xff0c;我将为大家深入解析透明OLED屏的制作过程&#xff0c;以及所面临的挑战。 首先&#xff0c;透明OLED屏的制作过程大致可分为以下几个步…

LabVIEW开发智能水泵监测系统

LabVIEW开发智能水泵监测系统 水泵作为水利、石化、农业等领域的重要设备&#xff0c;其能效与健康状态直接关系到提灌泵站的运行效率。尽管水泵机组在全球能源消耗中占有显著比例&#xff0c;但实际运行效率常因设备老化和维护不当而远低于预期。这一状况需要更高效的监测手段…

Proxmox VE 8 安装开源监控平台Centreon 23

作者&#xff1a;田逸&#xff08;formyz&#xff09; 非常好用的开源监控系统Centreon从版本号21.40以后&#xff08;包括Centreon 21.40这个版本&#xff09;&#xff0c;不在提供ISO一键式安装包&#xff0c;取而代之的是在线脚本安装和VMware虚拟机或者Oracle VirtualBox 虚…

1-并发编程线程基础

什么是线程 在讨论什么是线程前有必要先说下什么是进程&#xff0c;因为线程是进程中的一个实体&#xff0c;线程本身是不会独立存在的。 进程是代码在数据集合上的一次运行活动&#xff0c;是系统进行资源分配和调度的基本单位&#xff0c;线程则是进程的一个执行路径&#…

线性代数_对称矩阵

对称矩阵是线性代数中一种非常重要的矩阵结构&#xff0c;它具有许多独特的性质和应用。下面是对称矩阵的详细描述&#xff1a; ### 定义 对称矩阵&#xff0c;即对称方阵&#xff0c;是指一个n阶方阵A&#xff0c;其转置矩阵等于其本身&#xff0c;即A^T A。这意味着方阵A中的…

YOLOv8模型yaml结构图理解(逐层分析)

前言 YOLO-V8&#xff08;官网地址&#xff09;&#xff1a;https://github.com/ultralytics/ultralytics 一、yolov8配置yaml文件 YOLOv8的配置文件定义了模型的关键参数和结构&#xff0c;包括类别数、模型尺寸、骨架&#xff08;backbone&#xff09;和头部&#xff08;hea…

Linux安装JDK和Maven并配置环境变量

文章目录 一、安装JDK并配置环境变量二、安装maven并配置环境变量 一、安装JDK并配置环境变量 将JDK的安装包上传到Linux系统的usr/local目录 使用xftp上传文件 解压JDK的压缩包 xshell连接到云主机 [roottheo ~]# cd /usr/local[roottheo local]# ls aegis apache-tomcat-…

23 导航栏

效果演示 实现了一个响应式的导航栏&#xff0c;当鼠标悬停在导航栏上的某个选项上时&#xff0c;对应的横条会从左到右地移动&#xff0c;从而实现了导航栏的动态效果。 Code <div class"flex"><ul><li>1</li><li>2</li><l…

CommonJS 和 ES6 Module:一场模块规范的对决(下)

&#x1f90d; 前端开发工程师&#xff08;主业&#xff09;、技术博主&#xff08;副业&#xff09;、已过CET6 &#x1f368; 阿珊和她的猫_CSDN个人主页 &#x1f560; 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 &#x1f35a; 蓝桥云课签约作者、已在蓝桥云…

Python数值型字符串校验(try异常拦截解析)

从键盘输入一行字符串&#xff0c;编写Python代码判定字符串是python“合法”数值。 (笔记模板由python脚本于2023年12月25日 18:00:52创建&#xff0c;本篇笔记适合熟悉Python符串基本数据类型的coder翻阅) 【学习的细节是欢悦的历程】 Python 官网&#xff1a;https://www.py…

element-ui组件DatePicker日期选择器移动端兼容

element-ui组件DatePicker日期选择器移动端兼容 css /** 移动端展示 **/ media screen and (max-width: 500px) {.el-picker-panel__sidebar {width: 100%;}.el-picker-panel {width: 400px!important;}.el-picker-panel__content {width: 100%;}.el-picker-panel__body{marg…

Spark魔力:招聘网站数据深度分析系统

Spark魔力&#xff1a;招聘网站数据深度分析系统 简介数据集技术栈功能特点创新点 简介 在本文中&#xff0c;我们将介绍一款基于Spark的招聘网站数据分析系统&#xff0c;该系统使用爬取的前程无忧招聘数据。通过结合Flask、Pandas、PySpark、以及MySQL等技术&#xff0c;实现…

【C语言刷题每日一题#牛客网BC107】矩阵转置

目录 问题描述 思路逐步分析 完整代码实现 结果测试 问题描述 思路逐步分析 首先&#xff0c;根据输入的描述&#xff0c;第一行输入的是两个整数n和m&#xff0c;分别表示一个矩阵&#xff08;二维数组&#xff09;的行和列&#xff0c;并且行和列不超过10 根据要求&…