仿东方航空主页

最新推荐文章于 2024-07-24 13:45:34 发布
最新推荐文章于 2024-07-24 13:45:34 发布
阅读量158 收藏
点赞数
文章标签： css javascript 前端 html5 vscode
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/z2759922095/article/details/124808567
版权 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>东方航空</title>
    <link rel="stylesheet" href="./infont/iconfont.css" />
    <style type="text/css">
      * {
        margin: 0;
        padding: 0;
      }
      .head {
        margin: 0 auto;
        text-align: center;
        width: 1000px;
        height: 100px;
        font-size: 45px;
        background-position: left;
        color: #fff;
        font-family: "Arial Black", Gadget, sans-serif;
        background-color: #900;
      }
      .d2 {
        margin: 0 auto;
        font-size: 16px;
        text-align: center;
        width: 1000px;
        height: 80px;
        background-color: #000099;
      }
      a {
        text-decoration: none;
      }
      a:link {
        color: #fff;
      }
      a:hover {
        color: #f00;
      }
      .head img {
        width: 70px;
        height: 70px;
      }
      .zt {
        width: 1000px;
        height: 1000px;
        background-color: red;
      }
      .zt img {
        width: 400px;
        height: 350px;
        text-align: center;
      }

      .d2 ul li {
        display: inline-block;
        width: 160px;
        height: 50px;
        line-height: 80px;
        font-size: 29px;
      }
      .d2 ul li a {
        color: #fff;
      }
      .main {
        width: 100%;
        height: 720px;
        background: url(./10.jpeg) no-repeat;
        background-size: cover;
      }
      .main .box {
        position: relative;
        margin: 0 auto;
        width: 1000px;
        height: 575px;
        background-color: #fff;
      }
      .main .box .top {
        line-height: 70px;
        text-align: center;
        display: flex;
        justify-content: space-between;
      }
      .main .box .top .four {
        width: 25%;
        height: 70px;
        background-color: rgb(0, 162, 255);
      }
      .main .box .top .one {
        width: 25%;
        height: 70px;
        background-color: #fff;
      }
      .main .box input[type="radio"] {
        width: 20px;
        height: 20px;
      }
      .main .box .input {
        display: flex;
        justify-content: space-between;
        margin-left: 60px;
        margin-top: 40px;
        width: 950px;
        height: 50px;
      }
      .main .box .input span {
        vertical-align: top;

        margin-right: 50px;
      }
      .main .box .input .shape .squal {
        display: inline-block;
        margin-right: 10px;
        width: 20px;
        height: 20px;
        border: 1px solid #000;
      }
      /*飞机加酒结束*/
      /*地址*/
      .main .logical {
        display: flex;
        justify-content: space-around;
        width: 1000px;
        height: 140px;
      }
      .main .logical .three {
        margin-top: 20px;
        line-height: 50px;
        padding-left: 10px;
        width: 250px;
        height: 50px;
        background-color: aliceblue;
        border: 1px solid #000;
        border-radius: 5px;
      }
      /*地址*/
      /*搜索*/
      .middle {
        position: relative;
        display: flex;
        width: 1000px;
        height: 130px;
      }
      .middle img {
        margin-left: 40px;
        margin-top: 20px;
        width: 500px;
        height: 80px;
      }
      .search {
        font-size: large;
        font-weight: 500;
        color: #fff;
        text-align: center;
        line-height: 50px;
        position: absolute;
        right: -10px;
        top: 40px;
        margin-right: 50px;
        width: 150px;
        height: 50px;
        background-color: #f00;
        border: 1px solid #f00;
        border-radius: 5px;
      }
      /*搜索*/
      /*底部*/
      .bottom {
        position: absolute;
        bottom: 0;
        margin-bottom: 0;
        width: 1000px;
        height: 100px;
      }
      .bottom img {
        width: 1000px;
        height: 100px;
      }
      /*底部*/
      .left {
        position: absolute;
        top: 0;
        left: 0;
      }
      .left img {
        width: 260px;
        height: 180px;
      }
      .right {
        position: absolute;
        top: 0;
        right: 0;
      }
      .right img {
        width: 260px;
        height: 180px;
      }
    </style>
  </head>
  <body>
    <div class="head">
      <h2><img src="14.jpg" />中国东方航空欢迎您</h2>
    </div>
    <div class="d2">
      <ul>
        <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="main">
      <div class="box">
        <div class="top">
          <div class="one">航班搜索</div>
          <div class="four">选座值机</div>
          <div class="four">航班动态</div>
          <div class="four">东航金融</div>
        </div>
        <div class="input">
          <form action="">
            <input type="radio" checked /> <span>单程</span>
            <input type="radio" /> <span>往返</span> <input type="radio" />
            <span>多段</span>
          </form>
          <div class="shape">
            <div class="squal"></div>
            <span>机+酒</span>
          </div>
        </div>
        <div class="logical">
          <div class="three">
            <div class="iconfont icon-dizhi1">武汉/wuhan</div>
          </div>
          <div class="three">
            <div class="iconfont icon-dizhi1">上海/shanghai</div>
          </div>
          <div class="three">2021-11-11</div>
        </div>
        <div class="middle">
          <img src="./logo.png" alt="" />
          <div class="search">搜索</div>
        </div>
        <div class="bottom">
          <img src="./bottom.png" alt="" />
        </div>
      </div>
    </div>
    <div class="left"><img src="./13.jpeg" alt="" /></div>
    <div class="right"><img src="./空姐.jpg" alt="" /></div>
  </body>
</html>

计科秃头驴
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
研讨会报名 | 系统级仿真软件Flownex应用（电力行业专场）
2301_79094407的博客
08-14 68
主要原因是工质在各个子系统/部件内经历的物理过程差异性大（单相流动/多相流流动/气液相变/电化学反应/燃烧/特征时间尺度等），导致无法基于统一的数学模型进行求解。该软件在国内外电力行业得到了广泛的应用，成功应用于电力设备相关系统的开发、性能评估、工艺参数优化、运维侧的故障诊断及优化。多年的CFD从业经历，熟悉CFD在航空航天、新能源汽车、能源电力、通用机械、轨道交通等多个方向的解决方案。程序的管网系统设计软件，主要用于设计、优化复杂的热流动环境或者流体控制系统，完成准确、快速和高效的模拟。
航空发动机性能仿真软件GSP 11的LE版本
03-27
《航空发动机性能仿真软件GSP 11 LE版：深入解析与应用》 航空发动机作为飞行器的心脏，其性能的精确仿真对于飞机的设计、研发和优化至关重要。荷兰航空航天实验室（NLR）推出的GSP 11.0 LE版本，虽然定位为精简版...
韩顺平的php东方航空_韩顺平php视频教程
weixin_39961636的博客
12-20 210
韩顺平php从入门到精通视频教程是由知名的讲师韩顺平制作讲解的一套php基础入门教程，也是自学PHP必备的一系列教程。包含了php开山篇、html介绍、html运行原理、网上支付平台开发实例、XML编程祥解等内容，小编为大家带来的是百度云盘下载地址，有要学习PHP的不要错过。韩顺平php视频教程目录0讲 PHP开山篇1讲 html介绍 html运行原理①2讲 html运行原理② html文件基本结...
韩顺平的php东方航空_韩顺平PHP从入门到精通视频教程
weixin_39631767的博客
12-20 306
传智播客_韩顺平_php从入门到精通 视频教程 第001讲 html介绍 html运行原理①传智播客_韩顺平_php从入门到精通 视频教程 第002讲 html运行原理② html文件基本结构 html元素和属性传智播客_韩顺平_php从入门到精通 视频教程 第003讲 符号实体 url说明 超链接 发送电邮传智播客_韩顺平_php从入门到精通 视频教程 第004讲 图像 表格 实际应用-菜谱 课...
大唐杯仿真笔记-通信技术导论
wdkazzz的博客
03-31 4189
本节所记录的是关于大唐杯仿真类型中的通信技术导论部分，该部分每年都可能会增加新内容，大家可以结合本篇笔记、官方教程及B站相关视频学习，后续将更新大唐杯仿真部分的其他篇章。
SkyEye卫星篇-国的加强“芯”
digi2020的博客
08-22 205
近年来，卫星产业发展迅猛，数字化、网络化、智能化、服务化转型升级需求日益增长。为进一步完善星务软件验证工作、获取在轨卫星模拟数据，“数字卫星”成为当下主流趋势。
太空基建正当时，半实物仿真测试助力中国“飞天梦”
灵思创奇
07-07 530
7月4日，神舟十二号航天员乘组密切协同，圆满完成出舱活动期间全部既定任务，航天员刘伯明、汤洪波安全返回天和核心舱，标志着我国空间站建造阶段航天员首次出舱活动取得圆满成功。 载人航天是人类遨游星际梦想的开端。对于普通人来说，虽然不能亲自“上天”，但实际上，我们已经受惠于航天多年，其中最普惠、商用化程度最高的就是卫星，人造卫星在广播、电视、通信、气象观测、预报、卫星导航定位、地球环境监测、减灾救灾等场景都发挥了重大作用，未来10年，卫星将与5G、工业互联网、物联网结合，催生更加丰富的应用场景。 重点国家航天
东方瑞丰：飞行模拟机才是虚拟现实桂冠上的明珠
常言道
11-13 698
飞行模拟机是虚拟现实技术应用最深入也是最成熟的领域，没有之一。在虚拟现实技术不断发展的今天，2016年被看作是这一产业发展的元年。但与几乎所有新技术发展的轨迹类似，虚拟现...
航空产品数字化设计与NVIDIA Quadro FX专业显卡
有朋自远方来...
06-12 6232
http://www.idnovo.com.cn/magazine/2009/0725/article_190.html 航空产品数字化设计与NVIDIA Quadro FX专业显卡 2009-07-25 20:19:20  作者：智造网  来源：智造网—助力中国制造业创新—idnovo.com.cn 　　从2009年第三期开始，我
接棒“中国机长”，AI的航空英雄梦还需要什么？
脑极体
10-08 402
“四川8633，成都叫你”“四川8633，成都在叫你”……想必不少同学都在假期看过了这部《中国机长》，并为这些呼唤之后长久的沉默而心惊肉跳。至少我本人看完后，当天登机的脚...
东方航空并购案例.pptx
10-12
【东方航空并购上海航空案例分析】 东方航空与上海航空的并购案是一起在航空业具有重大影响的事件，涉及到技术、资本运作以及市场战略等多个层面。这次并购的主要目的是通过资源整合，提升两家公司在市场中的竞争力...
中国东方航空公司营销战略转型研究.zip
09-20
【中国东方航空公司营销战略转型研究】 中国东方航空公司作为中国三大国有航空公司之一，其营销战略的转型对于整个航空行业的启示和影响不容忽视。本研究聚焦于该公司如何适应不断变化的市场环境，利用现代技术和...
东方航空：2019年年度报告.PDF
05-23
【东方航空2019年年度报告】是中国东方航空股份有限公司对其2019年度经营状况、财务表现和公司治理的全面总结。本报告旨在提供真实、准确和完整的财务信息，以便投资者和利益相关者了解公司的运营情况和未来展望。 ...
东方航空网络营销分析.pdf
12-08
《东方航空网络营销分析》的报告揭示了在网络营销领域，东方航空如何适应市场变化，提升竞争力。随着民航市场竞争加剧，航空公司必须拓宽营销渠道，而网络营销正是其中的关键。东方航空自20世纪90年代末开始涉足网络...
CSS实现从上往下过渡效果
Rverdoser的博客
07-18 339
属性改变时（即鼠标悬停时），它会在0.5秒内完成平滑的从上往下移动50像素的变化。要在CSS中实现一个从上往下的过渡效果，你可以使用。类定义了一个方框，并指定了一个过渡效果，使得当。
css性能优化的方法
jht_520的博客
07-21 328
避免使用过多的动画和过渡效果：过多的动画和过渡效果会占用更多的 CPU 和内存资源，降低性能。以上是一些常见的 CSS 性能优化方法，具体的优化策略和技巧还需要根据具体的项目和需求来确定。避免嵌套和选择器冗余：尽量避免使用过多的嵌套和冗余的选择器，这会增加解析和匹配的时间。使用标准字体：使用浏览器默认的字体，而不是使用自定义字体文件，可以减少请求和文件大小。），会消耗更多的性能。避免使用昂贵的选择器：某些选择器，如后代选择器和通用选择器（使用缩写和简写属性：尽量使用简写属性来减少代码量，例如使用。
CSS相关记录
最新发布
oThrowsException的博客
07-24 601
它接受两个参数，分别表示在X轴和Y轴上的缩放比例。如果指定侧轴大小的属性值为’auto’，则其值会使项目的边距盒的尺寸尽可能接近所在行的尺寸，但同时会遵照’min/max-width/height’属性的限制。CSS的transform属性是一个功能强大的工具，允许你对HTML元素应用2D或3D转换效果，包括旋转、缩放、倾斜和移动等。（如果该行的尺寸小于弹性盒子元素的尺寸，则会向两个方向溢出相同的长度）。scaleX()、scaleY()、scaleZ()：这些函数分别用于沿X轴、Y轴和Z轴缩放元素。
CSS学习笔记[Web开发]
Jenlibein的博客
07-19 738
CSS 是一种描述 HTML 文档样式的语言。CSS 描述应该如何显示 HTML 元素。CSS 用于定义网页的样式，包括针对不同设备和屏幕尺寸的设计和布局。CSS指的是层叠样式表* (CascadingStyleSheets)CSS 描述了如何在屏幕、纸张或其他媒体上显示 HTML 元素CSS节省了大量工作。它可以同时控制多张网页的布局外部样式表存储在CSS 文件中***：**也称级联样式表。一张 HTML 页面 可以有 多个样式下面是一张提供了四个不同样式表的 HTML 页面。
东方航空java机试
03-07
东方航空的Java机试是该公司用于筛选Java开发人员的一种面试方式。在机试中，他们会考察应聘者对Java编程语言的掌握程度以及相关的技术能力。 通常，东方航空的Java机试会包含以下内容： 1. Java基础知识：包括...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值