時(shí)間：2023-07-30 11:06:02 | 來源：網(wǎng)站運(yùn)營
時(shí)間：2023-07-30 11:06:02 來源：網(wǎng)站運(yùn)營
HTML期末學(xué)生大作業(yè)-在線電影網(wǎng)站html+css+javascript：?
在線咨詢
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>叮當(dāng)電影 - 搜羅全網(wǎng)好電影</title> <link rel="shortcut icon" type="image/x-icon" href="favicon.ico"> <link rel="stylesheet" type="text/css" href="./css/index.css"></head><body><header class="header"> <div class="container"> <!--logo--> <a href="index.html" class="logo"></a> <!--導(dǎo)航標(biāo)簽--> <div class="nav"> <ul class="navbar"> <li><a href="index.html" class="active">首頁</a></li> <li><a href="movie.html">購票</a></li> <li><a href="javascript:;">影院</a></li> <li><a href="javascript:;">社區(qū)</a></li> </ul> </div> <!--購物車--> <div class="headcart"> <i class="cart-icon"></i> <b class="card-num"></b> <div class="card-tip"></div> </div> <!--用戶登陸注冊--> <div class="user"> <div class="userout"> <a href="login.html" class="login cur">登錄</a> <a href="register.html" class="register cur">注冊</a> </div> <div class="userin"> <a href="javascript:;" class="menu-item-user"> <img class="user-face" src="./imgs/userface.jpg" alt="userface"> <span class="user-name"></span> </a> <span class="caret"></span> <ul class="dropdown-menu"> <li><a href="javascript:;">個(gè)人中心</a></li> <li><a href="javascript:;">退出登錄</a></li> </ul> </div> </div> <!--搜索欄--> <div class="search"> <form class="form-search" action="" method=""> <input type="text" id="search-input" class="form-search-input" placeholder="搜電影、影院" autocomplete="off"/> <a class="form-search-icon" href="javascript:;" onclick="searchBtnClick(this,event)"></a> </form> </div> <!--APP下載--> <div class="app-download"> <span class="phone-icon"></span> <span class="app-text">下載APP</span> <span class="caret"></span> <div class="qrcode-tip"> <img class="qrcode-img" src="imgs/dingdang-qrcode.png" alt="掃描二維碼下載APP"/> <p class="qrcode-tip-title">掃碼下載客戶端</p> <p class="qrcode-tip-content">手機(jī)購票 方便實(shí)惠</p> </div> </div> </div></header><div class="container"> <div class="slidey"> <ul id="slidey-content" style="display: none"> <li> <img src="imgs/slideposter/Frozen2.jpg" alt=""> <p class="title">冰雪奇緣2</p> <p class="description">為什么艾莎一出生就帶著控制冰雪的能力？這個(gè)答案一致困擾著她，也威脅著王國的安全。 她將和安娜、克斯托夫、雪寶和馴鹿斯文展開一場危險(xiǎn)但非凡的旅程…</p> </li> <li> <img src="imgs/slideposter/ifseawave.jpg" alt=""> <p class="title">若能與你共乘海浪之上</p> <p class="description">青年消防員雛罌粟港和愛好沖浪的向水日菜子相遇并迅速展開熱戀。看似命中注定的這對戀人， 卻不幸遭遇生死別離。無法接受港已經(jīng)離世的雛子，某天突然發(fā)現(xiàn)，只要唱起屬于兩個(gè)人的那首歌，港就會(huì)從水中出現(xiàn)…</p> </li> <li> <img src="imgs/slideposter/skyfire.jpg" alt=""> <p class="title">天·火</p> <p class="description">火山噴發(fā)了，這些人的命運(yùn)糾結(jié)在一起。為了看見明天的太陽，他們必須與過去和解， 合力為自己也為眾生在絕境中尋找一條生路。 這是一個(gè)關(guān)于愛與勇氣、選擇與放棄、自救與他救的中國式英雄的故事…</p> </li> <li> <img src="imgs/slideposter/yewen4.jpg" alt=""> <p class="title">葉問4</p> <p class="description">因故來到美國唐人街的葉問，意外卷入一場當(dāng)?shù)剀姺絼萘εc華人武館的糾紛，面對日益猖狂的 民族歧視與壓迫，葉問挺身而出，在美國海軍陸戰(zhàn)隊(duì)軍營拼死一戰(zhàn)，以正宗詠春，向世界證明了中國功夫…</p> </li> </ul> <div class="slidey-main"> <a href="movie.html" class="slidey-main-link"></a> <div class="slidey-overlay"> <p class="slidey-overlay-title"></p> <p class="slidey-overlay-description"></p> <span class="slidey-progress"></span> </div> <div class="slidey-ctrls slidey-ctrls-pre"></div> <div class="slidey-ctrls slidey-ctrls-next"></div> </div> <div class="slidey-list"> <ul> <li> <table class="slidey-list-table"> <tr> <td rowspan="2" class="slidey-list-img"> <div></div> </td> <td class="slidey-list-title"></td> </tr> <tr> <td class="slidey-list-description"></td> </tr> </table> </li> <li> <table class="slidey-list-table"> <tr> <td rowspan="2" class="slidey-list-img"> <div></div> </td> <td class="slidey-list-title"></td> </tr> <tr> <td class="slidey-list-description"></td> </tr> </table> </li> <li> <table class="slidey-list-table"> <tr> <td rowspan="2" class="slidey-list-img"> <div></div> </td> <td class="slidey-list-title"></td> </tr> <tr> <td class="slidey-list-description"></td> </tr> </table> </li> <li> <table class="slidey-list-table"> <tr> <td rowspan="2" class="slidey-list-img"> <div></div> </td> <td class="slidey-list-title"></td> </tr> <tr> <td class="slidey-list-description"></td> </tr> </table> </li> </ul> </div> </div> <div class="movie-grid"> <div class="panel"> <div class="main"> <div class="panel-header"> <span class="panel-title">正在熱映（<span>20</span>部）</span> <a href="javascript:;" class="panel-more">更多</a> </div> <div class="movie-list"> <ul> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/bingxueqiyuan2.jpg" alt="" class="poster"> <span class="movie-score">8.0</span> </a> <span class="movie-title">冰雪奇緣2</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/chuixiaoren.jpg" alt="" class="poster"> <span class="movie-score">8.5</span> </a> <span class="movie-title">吹哨人</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/dayuezaidongji.jpg" alt="" class="poster"> <span class="movie-score">8.8</span> </a> <span class="movie-title">大約在冬季</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/haishanggangqinshi.jpg" alt="" class="poster"> <span class="movie-score">9.2</span> </a> <span class="movie-title">海上鋼琴師</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/ruonengyuni.jpg" alt="" class="poster"> <span class="movie-score">8.7</span> </a> <span class="movie-title">若能與你共乘海浪之上</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/tianhuo.jpg" alt="" class="poster"> <span class="movie-score">8.3</span> </a> <span class="movie-title">天·火</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/yewen4.jpg" alt="" class="poster"> <span class="movie-score">8.8</span> </a> <span class="movie-title">葉問4</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> <li> <a href="movie.html" class="movie-poster"> <img src="./imgs/poster/yishengyouni.jpg" alt="" class="poster"> <span class="movie-score">8.3</span> </a> <span class="movie-title">一生有你</span> <a href="movie.html" class="movie-ticket-buy">選座購票</a> </li> </ul> </div> </div> <div class="aside"> <div class="panel-header"> <span class="panel-title">今日票房</span> <a href="javascript:;" class="panel-more">更多</a> </div> <div class="movie-rank"> <ul> <li class="movie-rank-top1"> <a href="javascript:;"> <span class="movie-rank-num movie-rank-top3">1</span> <img src="./imgs/poster/haishanggangqinshi.jpg" alt=""> <div> <p class="movie-rank-name">海上鋼琴師</p> <span class="box-office">1500萬</span> </div> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num movie-rank-top3">2</span> <p class="movie-rank-name">葉問4</p> <span class="box-office">1400萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num movie-rank-top3">3</span> <p class="movie-rank-name">若能與你共乘海浪之上</p> <span class="box-office">1000萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">4</span> <p class="movie-rank-name">吹哨人</p> <span class="box-office">900萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">5</span> <p class="movie-rank-name">大約在冬季</p> <span class="box-office">800萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">6</span> <p class="movie-rank-name">吹哨人</p> <span class="box-office">700萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">7</span> <p class="movie-rank-name">天·火</p> <span class="box-office">600萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">8</span> <p class="movie-rank-name">一生有你</p> <span class="box-office">550萬</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">9</span> <p class="movie-rank-name">冰雪奇緣2</p> <span class="box-office">450萬</span> </a> </li> </ul> </div> </div> </div> <div class="panel"> <div class="main"> <div class="panel-header"> <span class="panel-title">即將上映（<span>30</span>部）</span> <a href="javascript:;" class="panel-more">更多</a> </div> <div class="movie-list"> <ul> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/bingxueqiyuan2.jpg" alt="" class="poster"> <span class="movie-score">12月25日上映</span> </a> <span class="movie-title">冰雪奇緣2</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/chuixiaoren.jpg" alt="" class="poster"> <span class="movie-score">12月25日上映</span> </a> <span class="movie-title">吹哨人</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/dayuezaidongji.jpg" alt="" class="poster"> <span class="movie-score">12月26日上映</span> </a> <span class="movie-title">大約在冬季</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/haishanggangqinshi.jpg" alt="" class="poster"> <span class="movie-score">12月26日上映</span> </a> <span class="movie-title">海上鋼琴師</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/ruonengyuni.jpg" alt="" class="poster"> <span class="movie-score">12月26日上映</span> </a> <span class="movie-title">若能與你共乘海浪之上</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/tianhuo.jpg" alt="" class="poster"> <span class="movie-score">12月27日上映</span> </a> <span class="movie-title">天·火</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/yewen4.jpg" alt="" class="poster"> <span class="movie-score">12月28日上映</span> </a> <span class="movie-title">葉問4</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> <li> <a href="javascript:;" class="movie-poster"> <img src="./imgs/poster/yishengyouni.jpg" alt="" class="poster"> <span class="movie-score">12月28日上映</span> </a> <span class="movie-title">一生有你</span> <a href="javascript:;" class="movie-ticket-buy">預(yù)售</a> </li> </ul> </div> </div> <div class="aside"> <div class="panel-header"> <span class="panel-title">備受期待</span> <a href="javascript:;" class="panel-more">更多</a> </div> <div class="movie-rank"> <ul> <li class="movie-rank-top1"> <a href="javascript:;"> <span class="movie-rank-num movie-rank-top3">1</span> <img src="./imgs/poster/haishanggangqinshi.jpg" alt=""> <div> <p class="movie-rank-name">海上鋼琴師</p> <span class="box-office">1500人想看</span> </div> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num movie-rank-top3">2</span> <p class="movie-rank-name">葉問4</p> <span class="box-office">1400人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num movie-rank-top3">3</span> <p class="movie-rank-name">若能與你共乘海浪之上</p> <span class="box-office">1000人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">4</span> <p class="movie-rank-name">吹哨人</p> <span class="box-office">900人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">5</span> <p class="movie-rank-name">大約在冬季</p> <span class="box-office">800人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">6</span> <p class="movie-rank-name">吹哨人</p> <span class="box-office">700人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">7</span> <p class="movie-rank-name">天·火</p> <span class="box-office">600人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">8</span> <p class="movie-rank-name">一生有你</p> <span class="box-office">550人想看</span> </a> </li> <li> <a href="javascript:;"> <span class="movie-rank-num">9</span> <p class="movie-rank-name">冰雪奇緣2</p> <span class="box-office">450人想看</span> </a> </li> </ul> </div> </div> </div> </div></div><footer class="footer"> <div class="container"> <div class="link-nav"> <ul> <li><a href="javascript:;">關(guān)于叮當(dāng)</a></li> <li><a href="javascript:;">加入我們</a></li> <li><a href="javascript:;">聯(lián)系我們</a></li> <li><a href="javascript:;">隱私政策</a></li> <li><a href="javascript:;">問題反饋</a></li> </ul> <div class="copyright">Copyright ? 2019 叮當(dāng)電影</div> </div> <div class="sns"> <a href="javascript:;" class="sina-icon icon"></a> <a href="javascript:;" class="wechat-icon icon"></a> <a href="javascript:;" class="rss-icon icon"></a> </div> </div></footer><div id="toTop"></div><script type="text/javascript" src="js/main.js"></script><script type="text/javascript" src="js/slidey.js"></script><script type="text/javascript"> window.onload = function () { setPage("index.html"); initPublic(); initScrollToTop(); new initSlidey(); };</script></body></html>
關(guān)鍵詞：電影,學(xué)生,作業(yè)
客戶&案例
營銷資訊
關(guān)于我們
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。
