ZIPHTML+CSS-实现电影介绍页面-静态页-泰坦尼克号 31.08KB

qq_43770056

资源文件列表:

泰坦尼克号-电影介绍.zip 大约有3个文件
  1. css/css.css 224.14KB
  2. index.html 10.46KB
  3. css/

资源介绍:

HTML+CSS-实现电影介绍页面-静态页-泰坦尼克号
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta content="width=device-width, initial-scale=1.0" name="viewport"> <title>泰坦尼克号</title> <meta content="" name="descriptison"> <meta content="" name="keywords"> <link href="./css/css.css" rel="stylesheet"> <body> <style> .thumbnail img { width: 100%; } </style> <header id="header" class="fixed-top"> <div class="container d-flex align-items-center"> <h1 class="logo mr-auto"> <a href="index.html">泰坦尼克号</a> </h1> </div> </header> <!-- ======= 头部轮播图 ======= --> <section id="hero"> <div class="container"></div> <div id="heroCarousel" class="carousel slide carousel-fade" data-ride="carousel"> <ol class="carousel-indicators" id="hero-carousel-indicators"></ol> <div class="carousel-inner" role="listbox"> <!-- Slide 1 --> <div class="carousel-item active" style="background-image: url(https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.imdb.cn%2Fupload%2Fother%2F2020%2F08%2F04%2F2079ca2d4d39a8c41b602506eed4cc35.jpg%3FimageView2%2F1%2Fformat%2Fjpg%2Fw%2F100%2Fh%2F100&refer=http%3A%2F%2Fpic.imdb.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1673880772&t=9395e65df20e988d69c77ac0343de3d9);background-position: 0 -250px;"></div> <!-- Slide 2 --> <div class="carousel-item" style="background-image: url(https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.imdb.cn%2Fupload%2Fother%2F2020%2F08%2F04%2F2079ca2d4d39a8c41b602506eed4cc35.jpg%3FimageView2%2F1%2Fformat%2Fjpg%2Fw%2F100%2Fh%2F100&refer=http%3A%2F%2Fpic.imdb.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1673880772&t=9395e65df20e988d69c77ac0343de3d9);background-position: 0 -250px;"></div> <!-- Slide 3 --> <div class="carousel-item" style="background-image: url(https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.imdb.cn%2Fupload%2Fother%2F2020%2F08%2F04%2F2079ca2d4d39a8c41b602506eed4cc35.jpg%3FimageView2%2F1%2Fformat%2Fjpg%2Fw%2F100%2Fh%2F100&refer=http%3A%2F%2Fpic.imdb.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1673880772&t=9395e65df20e988d69c77ac0343de3d9);background-position: 0 -250px;"></div> <!-- Slide 4 --> <div class="carousel-item" style="background-image: url(https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.imdb.cn%2Fupload%2Fother%2F2020%2F08%2F04%2F2079ca2d4d39a8c41b602506eed4cc35.jpg%3FimageView2%2F1%2Fformat%2Fjpg%2Fw%2F100%2Fh%2F100&refer=http%3A%2F%2Fpic.imdb.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1673880772&t=9395e65df20e988d69c77ac0343de3d9);background-position: 0 -250px;"></div> </div> <a class="carousel-control-prev" href="#heroCarousel" role="button" data-slide="prev" > <span class="carousel-control-prev-icon icofont-simple-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" href="#heroCarousel" role="button" data-slide="next" > <span class="carousel-control-next-icon icofont-simple-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </section> <!-- End Hero --> <main id="main"> <!-- ======= 首页介绍 ======= --> <section id="about" class="about"> <div class="container"> <div class="section-title"> <h2>泰坦尼克号</h2> <p> 《泰坦尼克号》是美国二十世纪福克斯电影公司、派拉蒙影业公司出品爱情片，由詹姆斯·卡梅隆执导，莱昂纳多·迪卡普里奥、凯特·温斯莱特领衔主演。影片以1912年泰坦尼克号邮轮在其处女航时触礁冰山而沉没的事件为背景，讲述了处于不同阶层的两个人穷画家杰克和贵族女露丝抛弃世俗的偏见坠入爱河，最终杰克把生存的机会让给了露丝的感人故事。 </p> </div> <div class="row content"> <div class="col-lg-6"> <img src="https://img2.baidu.com/it/u=362373641,353396387&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=313" class="img-fluid" alt=""> </div> <div class="col-lg-6 pt-4 pt-lg-0"> <p> 《泰坦尼克号》是美国二十世纪福克斯电影公司、派拉蒙影业公司出品爱情片，由詹姆斯·卡梅隆执导，莱昂纳多·迪卡普里奥、凯特·温斯莱特领衔主演。 </p> <p> 影片以1912年泰坦尼克号邮轮在其处女航时触礁冰山而沉没的事件为背景，讲述了处于不同阶层的两个人穷画家杰克和贵族女露丝抛弃世俗的偏见坠入爱河，最终杰克把生存的机会让给了露丝的感人故事。 该片于1997年12月19日在美国上映，1998年4月3日在中国内地上映，2012年4月10日以3D版在中国内地重映。 </p> </div> </div> </div> </section> <section id="recent-photos" class="recent-photos"> <div class="container"> <h3>剧照</h3> <div class="row"> <div class="col-lg-6 col-md-4 imgArea"> <div class="thumbnail"> <a href="#"> <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi2.hdslb.com%2Fbfs%2Farchive%2Fcca578d81deae9d316d9ab05bdfcacab2bff9f22.jpg&refer=http%3A%2F%2Fi2.hdslb.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1673881006&t=6da386239e1a41b05299e90f3e56f3b0" alt="..."> </a> </div> </div> <div class="col-lg-6 col-md-4 imgArea"> <div class="thumbnail"> <a href="#"> <img src="https://img2.baidu.com/it/u=362373641,353396387&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=313" alt="..."> </a> </div> </div> <div class="col-lg-6 col-md-4 imgArea"> <div class="thumbnail"> <a href="#"> <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.imdb.cn%2Fupload%2Fother%2F2020%2F08%2F04%2F2079ca2d4d39a8c41b602506eed4cc35.jpg%3FimageView2%2F1%2Fformat%2Fjpg%2Fw%2F100%2Fh%2F100&refer=http%3A%2F%2Fpic.imdb.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=16738807
100+评论
captcha
    相关资源
    类型标题大小时间
    ZIP毕设&课程作业_基于C#的wpf 银行管理系统.zip76.91KB5月前
    ZIP毕设&课程作业_基于C#的毛概考试系统.zip99.33KB5月前
    ZIP毕设&课程作业_基于C#的编写的一个简单的聊天系统.zip118.96KB5月前
    ZIP毕设&课程作业_基于C#的远程判题系统.zip113.47KB5月前
    ZIP学生宿舍管理系统 微信小程序+SpringBoot毕业设计 源码+数据库+论文+启动教程.zip20.59MB5月前
    ZIP宿舍管理小程序 微信小程序+SpringBoot毕业设计 源码+数据库+论文+启动教程.zip18.27MB5月前
    ZIP点餐系统 微信小程序+SpringBoot毕业设计 源码+数据库+论文+启动教程.zip15.97MB5月前
    ZIPRDTU H071 (2023-11-23 16-57-05).zip5.46MB5月前