devbox
AllinToyou
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

HTML期末学生大作业-电影网站html+css+javascript_电影登录页面html设计

作者：AllinToyou | 2024-02-13 13:43:50

赞

踩

电影登录页面html设计

HTML网页制作期末大作业-电影网站html+css+javascript 9个页面适用学生作业 课程设计在线电影影网、期末作业电影网、毕业设计在线电影网 10个JS效果

部分电影网页页面 

  

​​​​​​​

 

 

部分电影网页页面源码 

  1.  
  2. <!DOCTYPE html>
  3. <html lang="en">
  4.  
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="css/index.css">
  9.     <link rel="stylesheet" href="css/clear.css">
  10.     <title>首页</title>
  11.     <link rel="icon" href="images/title-lolg.png">
  12.  
  13. </head>
  14.  
  15. <body>
  16.     <header>
  17.         <div class="header-body">
  18.             <a href="index.html?123" class="logo">猫眼电影</a>
  19.             <div class="city">成都
  20.                 <span class="caret"></span>
  21.             </div>
  22.             <div class="city-list">
  23.                 <div class="now-city">
  24.                     定位城市: 定位失败
  25.                 </div>
  26.                 <div class="citys">
  27.                     <span class="icon"></span> 定位失败
  28.                 </div>
  29.             </div>
  30.             <div class="nav">
  31.                 <ul class="nav-list">
  32.                     <li><a href="index.html?123" class="nav-model active">首页</a></li>
  33.                     <li><a href="movies.html" class="nav-model">电影</a></li>
  34.                     <li><a href="cinemas.html" class="nav-model">影院</a></li>
  35.                     <li class="nav-model">演出</li>
  36.                     <li class="nav-model">榜单</li>
  37.                     <li class="nav-model">热点</li>
  38.                     <li class="nav-model">商城</li>
  39.                 </ul>
  40.             </div>
  41.             <div class="app-download">
  42.                 <a href="#">
  43.                     <span class="phone"></span> APP下载
  44.                     <span class="caret"></span>
  45.  
  46.                     <div class="appcode">
  47.                         <img src="images/phonecode.png" class="app-code"></img>
  48.                         <p class="down-tip">扫码下载APP</p>
  49.                         <p class="down-text">选座更优惠</p>
  50.                     </div>
  51.                 </a>
  52.             </div>
  53.             <div class="search">
  54.                 <div type="text" class="searchinput">
  55.                     <input type="text" class="input" placeholder="找影视剧、影人、影院">
  56.                     <input class="submit" type="submit" value="">
  57.                 </div>
  58.             </div>
  59.             <div class="userimg">
  60.                 <img src="images/user.png" alt="">
  61.                 <span class="caret"></span>
  62.             </div>
  63.             <div class="userlogin">
  64.                 <a href="login.html" class=" notlogin">登录</a>
  65.                 <div class="islogin nologin">
  66.                     <a href="personal.html">个人中心</a>
  67.                     <a href="index.html">退出</a>
  68.                 </div>
  69.             </div>
  70.     </header>
  71.     <!-- 轮播图 -->
  72.     <div class="wrap" id="wrap">
  73.         <ul class="content"></ul>
  74.         <a href="javascript:;" class="prev">&#60;</a>
  75.         <a href="javascript:;" class="next">&#62;</a>
  76.     </div>
  77.     <!-- 页面主体 -->
  78.     <div class="container">
  79.         <div class="main">
  80.             <!-- 正在热映 -->
  81.             <div class="hot-movie">
  82.                 <h2>正在热映（4部）</h2>
  83.                 <div class="movies" id="hotmovies">
  84.                 </div>
  85.             </div>
  86.             <!-- 即将上映 -->
  87.             <div class="movie-box">
  88.                 <div class="movie-header">
  89.                     <h2>即将上映（115部）</h2>
  90.                     <a href="#">
  91.                         <span>全部></span>
  92.                     </a>
  93.                 </div>
  94.                 <div class="movies">
  95.                     <div class="movies-model">
  96.                         <a href="">
  97.                             <img src="images/hotmovie1.png" alt="" srcset="">
  98.                         </a>
  99.                         <p>46461661人想看</p>
  100.                         <button onclick="alert('123')">预告片</button>
  101.                         <button onclick="alert('123')">预售</button>
  102.                         <p>9月31日上映</p>
  103.                     </div>
  104.                     <div class="movies-model">
  105.                         <a href="">
  106.                             <img src="images/hotmovie2.png" alt="" srcset="">
  107.                         </a>
  108.                         <p>46461661人想看</p>
  109.                         <button onclick="alert('123')">预告片</button>
  110.                         <button onclick="alert('123')">预售</button>
  111.                         <p>10月2日上映</p>
  112.                     </div>
  113.                     <div class="movies-model">
  114.                         <a href="">
  115.                             <img src="images/hotmovie3.png" alt="" srcset="">
  116.                         </a>
  117.                         <p>46461661人想看</p>
  118.                         <button onclick="alert('123')">预告片</button>
  119.                         <button onclick="alert('123')">预售</button>
  120.                         <p>11月1日上映</p>
  121.                     </div>
  122.                     <div class="movies-model">
  123.                         <a href="">
  124.                             <img src="images/hotmovie4.png" alt="" srcset="">
  125.                         </a>
  126.                         <p>46461661人想看</p>
  127.                         <button onclick="alert('123')">预告片</button>
  128.                         <button onclick="alert('123')">预售</button>
  129.                         <p>9月23日上映</p>
  130.                     </div>
  131.                     <div class="movies-model">
  132.                         <a href="">
  133.                             <img src="images/hotmovie1.png" alt="" srcset="">
  134.                         </a>
  135.                         <p>46461661人想看</p>
  136.                         <button onclick="alert('123')">预告片</button>
  137.                         <button onclick="alert('123')">预售</button>
  138.                         <p>9月31日上映</p>
  139.                     </div>
  140.                     <div class="movies-model">
  141.                         <a href="">
  142.                             <img src="images/hotmovie1.png" alt="" srcset="">
  143.                         </a>
  144.                         <p>46461661人想看</p>
  145.                         <button onclick="alert('123')">预告片</button>
  146.                         <button onclick="alert('123')">预售</button>
  147.                         <p>9月31日上映</p>
  148.                     </div>
  149.                     <div class="movies-model">
  150.                         <a href="">
  151.                             <img src="images/hotmovie1.png" alt="" srcset="">
  152.                         </a>
  153.                         <p>46461661人想看</p>
  154.                         <button onclick="alert('123')">预告片</button>
  155.                         <button onclick="alert('123')">预售</button>
  156.                         <p>9月31日上映</p>
  157.                     </div>
  158.                     <div class="movies-model">
  159.                         <a href="">
  160.                             <img src="images/hotmovie1.png" alt="" srcset="">
  161.                         </a>
  162.                         <p>46461661人想看</p>
  163.                         <button onclick="alert('123')">预告片</button>
  164.                         <button onclick="alert('123')">预售</button>
  165.                         <p>9月31日上映</p>
  166.                     </div>
  167.                 </div>
  168.             </div>
  169.             <!-- 热播电影 -->
  170.             <div class="movie-box">
  171.                 <div class="movie-header c hotmovie ">
  172.                     <h2>热播电影（115部）</h2>
  173.                     <a href="#">
  174.                         <span>全部></span>
  175.                     </a>
  176.                 </div>
  177.                 <div class="movies movies-hot">
  178.                     <div class="movies-model">
  179.                         <a href="">
  180.                             <img src="images/hotmovie1.png" alt="" srcset="">
  181.                         </a>
  182.                         <p>9.0分</p>
  183.                         <button class="buynow">立即购票</button>
  184.                     </div>
  185.                     <div class="movies-model">
  186.                         <a href="">
  187.                             <img src="images/hotmovie2.png" alt="" srcset="">
  188.                         </a>
  189.                         <p>9.0分</p>
  190.                         <button class="buynow">立即购票</button>
  191.  
  192.                     </div>
  193.                     <div class="movies-model">
  194.                         <a href="">
  195.                             <img src="images/hotmovie3.png" alt="" srcset="">
  196.                         </a>
  197.                         <p>9.0分</p>
  198.                         <button class="buynow">立即购票</button>
  199.  
  200.                     </div>
  201.                     <div class="movies-model">
  202.                         <a href="">
  203.                             <img src="images/hotmovie4.png" alt="" srcset="">
  204.                         </a>
  205.                         <p>9.0分</p>
  206.                         <button class="buynow">立即购票</button>
  207.  
  208.                     </div>
  209.                     <div class="movies-model">
  210.                         <a href="">
  211.                             <img src="images/hotmovie1.png" alt="" srcset="">
  212.                         </a>
  213.                         <p>9.0分</p>
  214.                         <button class="buynow">立即购票</button>
  215.  
  216.                     </div>
  217.                     <div class="movies-model">
  218.                         <a href="">
  219.                             <img src="images/hotmovie1.png" alt="" srcset="">
  220.                         </a>
  221.                         <p>9.0分</p>
  222.                         <button class="buynow">立即购票</button>
  223.  
  224.                     </div>
  225.                     <div class="movies-model">
  226.                         <a href="">
  227.                             <img src="images/hotmovie1.png" alt="" srcset="">
  228.                         </a>
  229.                         <p>9.0分</p>
  230.                         <button class="buynow">立即购票</button>
  231.  
  232.                     </div>
  233.                     <div class="movies-model">
  234.                         <a href="">
  235.                             <img src="images/hotmovie1.png" alt="" srcset="">
  236.                         </a>
  237.                         <p>9.0分</p>
  238.                         <button class="buynow">立即购票</button>
  239.  
  240.                     </div>
  241.                 </div>
  242.             </div>
  243.             <!-- 喜剧电影 -->
  244.             <div class="movie-box">
  245.                 <div class="movie-header">
  246.                     <h2>喜剧电影（115部）</h2>
  247.                     <a href="#">
  248.                         <span>全部></span>
  249.                     </a>
  250.                 </div>
  251.                 <div class="movies">
  252.                     <div class="movies-model">
  253.                         <a href="">
  254.                             <img src="images/hotmovie1.png" alt="" srcset="">
  255.                         </a>
  256.                         <p>9.0分</p>
  257.                         <button class="buynow">立即购票</button>
  258.  
  259.                     </div>
  260.                     <div class="movies-model">
  261.                         <a href="">
  262.                             <img src="images/hotmovie2.png" alt="" srcset="">
  263.                         </a>
  264.                         <p>9.0分</p>
  265.                         <button class="buynow">立即购票</button>
  266.  
  267.                     </div>
  268.                     <div class="movies-model">
  269.                         <a href="">
  270.                             <img src="images/hotmovie3.png" alt="" srcset="">
  271.                         </a>
  272.                         <p>9.0分</p>
  273.                         <button class="buynow">立即购票</button>
  274.  
  275.                     </div>
  276.                     <div class="movies-model">
  277.                         <a href="">
  278.                             <img src="images/hotmovie4.png" alt="" srcset="">
  279.                         </a>
  280.                         <p>9.0分</p>
  281.                         <button class="buynow">立即购票</button>
  282.  
  283.                     </div>
  284.                     <div class="movies-model">
  285.                         <a href="">
  286.                             <img src="images/hotmovie1.png" alt="" srcset="">
  287.                         </a>
  288.                         <p>9.0分</p>
  289.                         <button class="buynow">立即购票</button>
  290.  
  291.                     </div>
  292.                     <div class="movies-model">
  293.                         <a href="">
  294.                             <img src="images/hotmovie1.png" alt="" srcset="">
  295.                         </a>
  296.                         <p>9.0分</p>
  297.                         <button class="buynow">立即购票</button>
  298.  
  299.                     </div>
  300.                     <div class="movies-model">
  301.                         <a href="">
  302.                             <img src="images/hotmovie1.png" alt="" srcset="">
  303.                         </a>
  304.                         <p>9.0分</p>
  305.                         <button class="buynow">立即购票</button>
  306.  
  307.                     </div>
  308.                     <div class="movies-model">
  309.                         <a href="">
  310.                             <img src="images/hotmovie1.png" alt="" srcset="">
  311.                         </a>
  312.                         <p>9.0分</p>
  313.                         <button class="buynow">立即购票</button>
  314.  
  315.                     </div>
  316.                 </div>
  317.             </div>
  318.             <!-- 动作电影 -->
  319.             <div class="movie-box">
  320.                 <div class="movie-header c hotmovie ">
  321.                     <h2>动作电影（125部）</h2>
  322.                     <a href="#">
  323.                         <span>全部></span>
  324.                     </a>
  325.                 </div>
  326.                 <div class="movies movies-hot">
  327.                     <div class="movies-model">
  328.                         <a href="">
  329.                             <img src="images/hotmovie1.png" alt="" srcset="">
  330.                         </a>
  331.                         <p>9.0分</p>
  332.                         <button class="buynow">立即购票</button>
  333.                     </div>
  334.                     <div class="movies-model">
  335.                         <a href="">
  336.                             <img src="images/hotmovie2.png" alt="" srcset="">
  337.                         </a>
  338.                         <p>9.0分</p>
  339.                         <button class="buynow">立即购票</button>
  340.  
  341.                     </div>
  342.                     <div class="movies-model">
  343.                         <a href="">
  344.                             <img src="images/hotmovie3.png" alt="" srcset="">
  345.                         </a>
  346.                         <p>9.0分</p>
  347.                         <button class="buynow">立即购票</button>
  348.  
  349.                     </div>
  350.                     <div class="movies-model">
  351.                         <a href="">
  352.                             <img src="images/hotmovie4.png" alt="" srcset="">
  353.                         </a>
  354.                         <p>9.0分</p>
  355.                         <button class="buynow">立即购票</button>
  356.  
  357.                     </div>
  358.                     <div class="movies-model">
  359.                         <a href="">
  360.                             <img src="images/hotmovie1.png" alt="" srcset="">
  361.                         </a>
  362.                         <p>9.0分</p>
  363.                         <button class="buynow">立即购票</button>
  364.  
  365.                     </div>
  366.                     <div class="movies-model">
  367.                         <a href="">
  368.                             <img src="images/hotmovie1.png" alt="" srcset="">
  369.                         </a>
  370.                         <p>9.0分</p>
  371.                         <button class="buynow">立即购票</button>
  372.  
  373.                     </div>
  374.                     <div class="movies-model">
  375.                         <a href="">
  376.                             <img src="images/hotmovie1.png" alt="" srcset="">
  377.                         </a>
  378.                         <p>9.0分</p>
  379.                         <button class="buynow">立即购票</button>
  380.  
  381.                     </div>
  382.                     <div class="movies-model">
  383.                         <a href="">
  384.                             <img src="images/hotmovie1.png" alt="" srcset="">
  385.                         </a>
  386.                         <p>9.0分</p>
  387.                         <button class="buynow">立即购票</button>
  388.  
  389.                     </div>
  390.                 </div>
  391.             </div>
  392.             <!-- 恐怖片 -->
  393.             <div class="movie-box">
  394.                 <div class="movie-header">
  395.                     <h2>恐怖电影（115部）</h2>
  396.                     <a href="#">
  397.                         <span>全部></span>
  398.                     </a>
  399.                 </div>
  400.                 <div class="movies">
  401.                     <div class="movies-model">
  402.                         <a href="">
  403.                             <img src="images/hotmovie1.png" alt="" srcset="">
  404.                         </a>
  405.                         <p>9.0分</p>
  406.                         <button class="buynow">立即购票</button>
  407.  
  408.                     </div>
  409.                     <div class="movies-model">
  410.                         <a href="">
  411.                             <img src="images/hotmovie2.png" alt="" srcset="">
  412.                         </a>
  413.                         <p>9.0分</p>
  414.                         <button class="buynow">立即购票</button>
  415.  
  416.                     </div>
  417.                     <div class="movies-model">
  418.                         <a href="">
  419.                             <img src="images/hotmovie3.png" alt="" srcset="">
  420.                         </a>
  421.                         <p>9.0分</p>
  422.                         <button class="buynow">立即购票</button>
  423.  
  424.                     </div>
  425.                     <div class="movies-model">
  426.                         <a href="">
  427.                             <img src="images/hotmovie4.png" alt="" srcset="">
  428.                         </a>
  429.                         <p>9.0分</p>
  430.                         <button class="buynow">立即购票</button>
  431.  
  432.                     </div>
  433.                     <div class="movies-model">
  434.                         <a href="">
  435.                             <img src="images/hotmovie1.png" alt="" srcset="">
  436.                         </a>
  437.                         <p>9.0分</p>
  438.                         <button class="buynow">立即购票</button>
  439.  
  440.                     </div>
  441.                     <div class="movies-model">
  442.                         <a href="">
  443.                             <img src="images/hotmovie1.png" alt="" srcset="">
  444.                         </a>
  445.                         <p>9.0分</p>
  446.                         <button class="buynow">立即购票</button>
  447.  
  448.                     </div>
  449.                     <div class="movies-model">
  450.                         <a href="">
  451.                             <img src="images/hotmovie1.png" alt="" srcset="">
  452.                         </a>
  453.                         <p>9.0分</p>
  454.                         <button class="buynow">立即购票</button>
  455.  
  456.                     </div>
  457.                     <div class="movies-model">
  458.                         <a href="">
  459.                             <img src="images/hotmovie1.png" alt="" srcset="">
  460.                         </a>
  461.                         <p>9.0分</p>
  462.                         <button class="buynow">立即购票</button>
  463.  
  464.                     </div>
  465.                 </div>
  466.             </div>
  467.         </div>
  468.         <!-- 侧边栏 -->
  469.         <div class="aside">
  470.             <!-- 今日票房 -->
  471.             <div class="rank">
  472.                 <h2>今日票房</h2>
  473.                 <div class="ranklist">
  474.                     <ul class="ranks">
  475.                         <li class=" rangk-item-first clearfix">
  476.                             <a href="#">
  477.                                 <div class="first-item clearfix">
  478.                                     <img src="images/rank.png" alt="" srcset="">
  479.                                 </div>
  480.                                 <p class="name">爱宠大机密2</p>
  481.                                 <p class="money">0.72万</p>
  482.                             </a>
  483.                         </li>
  484.                         <li class="rank-item">
  485.                             <a href="#">
  486.                                 <div class="index-box">
  487.                                     <i class="index index-hot">2</i>
  488.                                     <span>冰雪奇缘2</span>
  489.                                 </div>
  490.                                 <span class="index-money">0.00万</span>
  491.  
  492.                             </a>
  493.                         </li>
  494.                         <li class="rank-item">
  495.                             <a href="#">
  496.                                 <div class="index-box">
  497.                                     <i class="index index-hot">3</i>
  498.                                     <span>冰雪奇缘2</span>
  499.                                 </div>
  500.                                 <span class="index-money">0.00万</span>
  501.                             </a>
  502.                         </li>
  503.                         <li class="rank-item">
  504.                             <a href="#">
  505.                                 <div class="index-box">
  506.                                     <i class="index">4</i>
  507.                                     <span>冰雪奇缘2</span>
  508.                                 </div>
  509.                                 <span class="index-money">0.00万</span>
  510.  
  511.                             </a>
  512.                         </li>
  513.                         <li class="rank-item">
  514.                             <a href="#">
  515.                                 <div class="index-box">
  516.                                     <i class="index">5</i>
  517.                                     <span>冰雪奇缘2</span>
  518.                                 </div>
  519.                                 <span class="index-money">0.00万</span>
  520.                             </a>
  521.                         </li>
  522.                     </ul>
  523.                 </div>
  524.             </div>
  525.             <!-- 今日大盘 -->
  526.             <div class="aside-total">
  527.                 <h2 class="total-nav">今日大盘</h2>
  528.                 <div class="total-body">
  529.                     <h2>0.6 <span>万</span></h2>
  530.                     <span class="more">查看更多></span>
  531.                     <p class="time"><span>北京时间14:48:31</span> <span>猫眼专业版实时票房数据</span></p>
  532.                 </div>
  533.             </div>
  534.             <!-- 最受期待 -->
  535.             <div class="hope">
  536.                 <h2>最受期待 <span>查看完整榜单></span></h2>
  537.                 <div class="hope-body">
  538.                     <ul class="hope-list">
  539.                         <li class="hope-item-top1">
  540.                             <a href="#">
  541.                                 <div class="hope-img">
  542.                                     <img src="images/hope1.png" alt="">
  543.                                 </div>
  544.                                 <div class="hope-text">
  545.                                     <p class="hope-name">姜子牙</p>
  546.                                     <p class="hope-time">上映时间：2020</p>
  547.                                     <p class="hope-num">932707人想看</p>
  548.                                 </div>
  549.  
  550.                             </a>
  551.                         </li>
  552.                         <li class="hope-item-top">
  553.                             <a href="#">
  554.                                 <div class="hope-img">
  555.                                     <img src="images/hope2.png" alt="">
  556.                                 </div>
  557.                                 <p class="hope-name">哪吒重生</p>
  558.                                 <p class="hope-num">932707人想看</p>
  559.                             </a>
  560.                         </li>
  561.                         <li class="hope-item-top left">
  562.                             <a href="#">
  563.                                 <div class="hope-img">
  564.                                     <img src="images/hope3.png" alt="">
  565.                                 </div>
  566.                                 <p class="hope-name">唐人街探案3</p>
  567.                                 <p class="hope-num">932707人想看</p>
  568.                             </a>
  569.                         </li>
  570.                         <li class="hope-item">
  571.                             <a href="#">
  572.                                 <div class="index-box">
  573.                                     <i class="index index-hot">4</i>
  574.                                     <span>冰雪奇缘2</span>
  575.                                 </div>
  576.                                 <span class="hope-num">932707人想看</span>
  577.                             </a>
  578.                         </li>
  579.                         <li class="hope-item">
  580.                             <a href="#">
  581.                                 <div class="index-box">
  582.                                     <i class="index index-hot">5</i>
  583.                                     <span>冰雪奇缘2</span>
  584.                                 </div>
  585.                                 <span class="hope-num">932707人想看</span>
  586.                             </a>
  587.                         </li>
  588.                         <li class="hope-item">
  589.                             <a href="#">
  590.                                 <div class="index-box">
  591.                                     <i class="index index-hot">6</i>
  592.                                     <span>冰雪奇缘2</span>
  593.                                 </div>
  594.                                 <span class="hope-num">932707人想看</span>
  595.                             </a>
  596.                         </li>
  597.                         <li class="hope-item">
  598.                             <a href="#">
  599.                                 <div class="index-box">
  600.                                     <i class="index index-hot">7</i>
  601.                                     <span>冰雪奇缘2</span>
  602.                                 </div>
  603.                                 <span class="hope-num">932707人想看</span>
  604.                             </a>
  605.                         </li>
  606.                         <li class="hope-item">
  607.                             <a href="#">
  608.                                 <div class="index-box">
  609.                                     <i class="index index-hot">8</i>
  610.                                     <span>冰雪奇缘2</span>
  611.                                 </div>
  612.                                 <span class="hope-num">932707人想看</span>
  613.                             </a>
  614.                         </li>
  615.                         <li class="hope-item">
  616.                             <a href="#">
  617.                                 <div class="index-box">
  618.                                     <i class="index index-hot">9</i>
  619.                                     <span>冰雪奇缘2</span>
  620.                                 </div>
  621.                                 <span class="hope-num">932707人想看</span>
  622.                             </a>
  623.                         </li>
  624.                         <li class="hope-item">
  625.                             <a href="#">
  626.                                 <div class="index-box">
  627.                                     <i class="index index-hot">10</i>
  628.                                     <span>冰雪奇缘2</span>
  629.                                 </div>
  630.                                 <span class="hope-num">932707人想看</span>
  631.                             </a>
  632.                         </li>
  633.                     </ul>
  634.                 </div>
  635.             </div>
  636.             <!-- top100 -->
  637.             <div class="top">
  638.                 <h2>TOP 100 <span>查看完整榜单></span></h2>
  639.                 <div class="toplist">
  640.                     <ul class="topone">
  641.                         <li class=" top-item-first clearfix">
  642.                             <a href="#">
  643.                                 <div class="first-item clearfix">
  644.                                     <img src="images/top1.png" alt="" srcset="">
  645.                                 </div>
  646.                                 <p class="name">活着</p>
  647.                                 <p class="money">9.0分</p>
  648.                             </a>
  649.                         </li>
  650.                         <li class="top-item">
  651.                             <a href="#">
  652.                                 <div class="index-box">
  653.                                     <i class="index index-hot">2</i>
  654.                                     <span>钢琴家</span>
  655.                                 </div>
  656.                                 <span class="index-money">8.8分</span>
  657.  
  658.                             </a>
  659.                         </li>
  660.                         <li class="top-item">
  661.                             <a href="#">
  662.                                 <div class="index-box">
  663.                                     <i class="index index-hot">3</i>
  664.                                     <span>勇敢的心</span>
  665.                                 </div>
  666.                                 <span class="index-money">8.8分</span>
  667.                             </a>
  668.                         </li>
  669.                         <li class="top-item">
  670.                             <a href="#">
  671.                                 <div class="index-box">
  672.                                     <i class="index">4</i>
  673.                                     <span>阿飞正传</span>
  674.                                 </div>
  675.                                 <span class="index-money">8.8分</span>
  676.  
  677.                             </a>
  678.                         </li>
  679.                         <li class="top-item">
  680.                             <a href="#">
  681.                                 <div class="index-box">
  682.                                     <i class="index">5</i>
  683.                                     <span>射雕英雄传之东成西就</span>
  684.                                 </div>
  685.                                 <span class="index-money">8.8分</span>
  686.                             </a>
  687.                         </li>
  688.                         <li class="top-item">
  689.                             <a href="#">
  690.                                 <div class="index-box">
  691.                                     <i class="index">6</i>
  692.                                     <span>爱回家</span>
  693.                                 </div>
  694.                                 <span class="index-money">8.8分</span>
  695.                             </a>
  696.                         </li>
  697.                         <li class="top-item">
  698.                             <a href="#">
  699.                                 <div class="index-box">
  700.                                     <i class="index">7</i>
  701.                                     <span>初恋这件小事</span>
  702.                                 </div>
  703.                                 <span class="index-money">8.8分</span>
  704.                             </a>
  705.                         </li>
  706.                         <li class="top-item">
  707.                             <a href="#">
  708.                                 <div class="index-box">
  709.                                     <i class="index">8</i>
  710.                                     <span>泰坦尼克号</span>
  711.                                 </div>
  712.                                 <span class="index-money">8.8分</span>
  713.                             </a>
  714.                         </li>
  715.                         <li class="top-item">
  716.                             <a href="#">
  717.                                 <div class="index-box">
  718.                                     <i class="index">9</i>
  719.                                     <span>迁徙的鸟</span>
  720.                                 </div>
  721.                                 <span class="index-money">8.8分</span>
  722.                             </a>
  723.                         </li>
  724.                         <li class="top-item">
  725.                             <a href="#">
  726.                                 <div class="index-box">
  727.                                     <i class="index">10</i>
  728.                                     <span>蝙蝠侠：黑暗骑士</span>
  729.                                 </div>
  730.                                 <span class="index-money">8.8分</span>
  731.                             </a>
  732.                         </li>
  733.                     </ul>
  734.                 </div>
  735.             </div>
  736.             <!-- 热门影人 -->
  737.             <div class="people">
  738.                 <h2>热门影人</h2>
  739.                 <div class="peoplelist">
  740.                     <ul class="peoples">
  741.                         <li class=" people-item-first clearfix">
  742.                             <a href="#">
  743.                                 <div class="first-item clearfix">
  744.                                     <img src="images/people.png" alt="" srcset="">
  745.                                 </div>
  746.                                 <p class="name">大张伟</p>
  747.                             </a>
  748.                         </li>
  749.                         <li class="people-item">
  750.                             <a href="#">
  751.                                 <div class="index-box">
  752.                                     <i class="index index-hot">2</i>
  753.                                     <span>蔡国庆</span>
  754.                                 </div>
  755.                             </a>
  756.                         </li>
  757.                         <li class="people-item">
  758.                             <a href="#">
  759.                                 <div class="index-box">
  760.                                     <i class="index index-hot">3</i>
  761.                                     <span>黄一山</span>
  762.                                 </div>
  763.  
  764.                             </a>
  765.                         </li>
  766.                         <li class="people-item">
  767.                             <a href="#">
  768.                                 <div class="index-box">
  769.                                     <i class="index">4</i>
  770.                                     <span>蔡轩正</span>
  771.                                 </div>
  772.                             </a>
  773.                         </li>
  774.                         <li class="people-item">
  775.                             <a href="#">
  776.                                 <div class="index-box">
  777.                                     <i class="index">5</i>
  778.                                     <span>平安</span>
  779.                                 </div>
  780.                             </a>
  781.                         </li>
  782.                         <li class="people-item">
  783.                             <a href="#">
  784.                                 <div class="index-box">
  785.                                     <i class="index">6</i>
  786.                                     <span>王源</span>
  787.                                 </div>
  788.                             </a>
  789.                         </li>
  790.                         <li class="people-item">
  791.                             <a href="#">
  792.                                 <div class="index-box">
  793.                                     <i class="index">7</i>
  794.                                     <span>小黑</span>
  795.                                 </div>
  796.                             </a>
  797.                         </li>
  798.                         <li class="people-item">
  799.                             <a href="#">
  800.                                 <div class="index-box">
  801.                                     <i class="index">8</i>
  802.                                     <span>郁可唯</span>
  803.                                 </div>
  804.                             </a>
  805.                         </li>
  806.                         <li class="people-item">
  807.                             <a href="#">
  808.                                 <div class="index-box">
  809.                                     <i class="index">9</i>
  810.                                     <span>许魏洲</span>
  811.                                 </div>
  812.                             </a>
  813.                         </li>
  814.                         <li class="people-item">
  815.                             <a href="#">
  816.                                 <div class="index-box">
  817.                                     <i class="index">10</i>
  818.                                     <span>王力宏</span>
  819.                                 </div>
  820.                             </a>
  821.                         </li>
  822.                     </ul>
  823.                 </div>
  824.             </div>
  825.             <!-- 娱乐热点 -->
  826.             <div class="hotspot">
  827.                 <h2>娱乐热点</h2>
  828.                 <div class="hotspotlist">
  829.                     <ul class="hotspots">
  830.                         <li class=" hotspot-item-first clearfix">
  831.                             <a href="#">
  832.                                 <div class="first-item clearfix">
  833.                                     <img src="images/hotspot.png" alt="" srcset="">
  834.                                 </div>
  835.                                 <p class="name">《什刹海》今晚央一开播...</p>
  836.                             </a>
  837.                         </li>
  838.                         <li class="hotspot-item">
  839.                             <a href="#">
  840.                                 <div class="index-box">
  841.                                     <i class="index index-hot">2</i>
  842.                                     <span>反差萌!动画电影《杨戬》“哮天犬” 形象首次曝光</span>
  843.                                 </div>
  844.                             </a>
  845.                         </li>
  846.                         <li class="hotspot-item">
  847.                             <a href="#">
  848.                                 <div class="index-box">
  849.                                     <i class="index index-hot">3</i>
  850.                                     <span>《民初奇人传》火热收官奇趣甜三大法宝发力赢口碑</span>
  851.                                 </div>
  852.  
  853.                             </a>
  854.                         </li>
  855.                         <li class="hotspot-item">
  856.                             <a href="#">
  857.                                 <div class="index-box">
  858.                                     <i class="index">4</i>
  859.                                     <span>电影《再见吧!少年》曝阵容刘敏涛荣梓杉大银幕..</span>
  860.                                 </div>
  861.                             </a>
  862.                         </li>
  863.                         <li class="hotspot-item">
  864.                             <a href="#">
  865.                                 <div class="index-box">
  866.                                     <i class="index">5</i>
  867.                                     <span>布拉德:皮特参演《死侍2》导演全新动作片后者曾...</span>
  868.                                 </div>
  869.                             </a>
  870.                         </li>
  871.                         <li class="hotspot-item">
  872.                             <a href="#">
  873.                                 <div class="index-box">
  874.                                     <i class="index">6</i>
  875.                                     <span>《漂亮书生》首曝剧照鞠婧祎宋威龙携“漂亮战队...</span>
  876.                                 </div>
  877.                             </a>
  878.                         </li>
  879.                         <li class="hotspot-item">
  880.                             <a href="#">
  881.                                 <div class="index-box">
  882.                                     <i class="index">7</i>
  883.                                     <span>《温暖的抱抱》首曝预告常远李沁邂逅妙手“神经...</span>
  884.                                 </div>
  885.                             </a>
  886.                         </li>
  887.                         <li class="hotspot-item">
  888.                             <a href="#">
  889.                                 <div class="index-box">
  890.                                     <i class="index">8</i>
  891.                                     <span>汤姆汉克斯一让每一 份人生， 都成为充满期待的..</span>
  892.                                 </div>
  893.                             </a>
  894.                         </li>
  895.                         <li class="hotspot-item">
  896.                             <a href="#">
  897.                                 <div class="index-box">
  898.                                     <i class="index">9</i>
  899.                                     <span>电影《至暗陷阱》至暗双雄霸气亮相明暗对决一触..</span>
  900.                                 </div>
  901.                             </a>
  902.                         </li>
  903.                         <li class="hotspot-item">
  904.                             <a href="#">
  905.                                 <div class="index-box">
  906.                                     <i class="index">10</i>
  907.                                     <span>《什刹海》央一定档7.10， “多彩京韵” 版海报今...</span>
  908.                                 </div>
  909.                             </a>
  910.                         </li>
  911.                     </ul>
  912.                 </div>
  913.             </div>
  914.         </div>
  915.     </div>
  916.     <!-- 页面底部 -->
  917.     <div class="footer" style="visibility: visible;">
  918.         <p class="friendly-links">
  919.             关于猫眼 :
  920.             <a href="#" target="_blank">关于我们</a>
  921.             <span></span>
  922.             <a href="#" target="_blank">管理团队</a>
  923.             <span></span>
  924.             <a href="#" target="_blank">投资者关系</a> &nbsp;&nbsp;&nbsp;&nbsp; 友情链接 :
  925.             <a href="#" data-query="utm_source=wwwmaoyan" target="_blank">美团网</a>
  926.             <span></span>
  927.             <a href="#" data-query="utm_source=wwwmaoyan">格瓦拉</a>
  928.             <span></span>
  929.             <a href="#" data-query="utm_source=wwwmaoyan" target="_blank">美团下载</a>
  930.             <span></span>
  931.             <a href="#" data-query="utm_source=maoyan_pc" target="_blank">欢喜首映</a>
  932.         </p>
  933.         <p class="friendly-links">
  934.             商务合作邮箱：v@maoyan.com 客服电话：10105335 违法和不良信息举报电话：4006018900
  935.         </p>
  936.         <p class="friendly-links">
  937.             用户投诉邮箱：tousujubao@meituan.com 舞弊线索举报邮箱：wubijubao@maoyan.com
  938.         </p>
  939.         <p class="friendly-links  credentials">
  940.             <a href="#" target="_blank">中华人民共和国增值电信业务经营许可证 京B2-20190350</a>
  941.             <span></span>
  942.             <a href="#" target="_blank">营业性演出许可证 京演（机构）（2019）4094号</a>
  943.         </p>
  944.         <p class="friendly-links  credentials">
  945.             <a href="#" target="_blank">广播电视节目制作经营许可证 （京）字第08478号</a>
  946.             <span></span>
  947.             <a href="#" target="_blank">网络文化经营许可证 京网文（2019）3837-369号 </a>
  948.         </p>
  949.         <p class="friendly-links  credentials">
  950.             <a href="#" target="_blank">猫眼用户服务协议 </a>
  951.             <span></span>
  952.             <a href="#" target="_blank">猫眼平台交易规则总则 </a>
  953.             <span></span>
  954.             <a href="#" target="_blank">隐私政策 </a>
  955.         </p>
  956.         <p class="friendly-links  credentials">
  957.             <a href="" target="_blank">京公网安备
  958.             11010102003232号</a>
  959.             <span></span>
  960.             <a href="#/" target="_blank">京ICP备16022489号</a>
  961.         </p>
  962.         <p>北京猫眼文化传媒有限公司</p>
  963.         <p>
  964.             ©<span class="my-footer-year">2020</span> 猫眼电影 maoyan.com</p>
  965.         <div class="certificate">
  966.             <a href="#" target="_blank">
  967.                 <img src="http://p0.meituan.net/moviemachine/e54374ccf134d1f7b2c5b075a74fca525326.png">
  968.             </a>
  969.             <a href="#" target="_blank">
  970.                 <img src="http://p1.meituan.net/moviemachine/805f605d5cf1b1a02a4e3a5e29df003b8376.png">
  971.             </a>
  972.             <a href="h#" target="_blank">
  973.                 <img src="http://p0.meituan.net/scarlett/3cd2a9b7dc179531d20d27a5fd686e783787.png">
  974.             </a>
  975.         </div>
  976.     </div>
  977.  
  978.  
  979.     <script src="js/ajax.js"></script>
  980.     <script src="js/mock-min.js"></script>
  981.     <script src="js/server.js"></script>
  982.     <script src="js/index.js"></script>
  983. </body>
  984.  
  985. </html>

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/AllinToyou/article/detail/80156
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号