大一學(xué)生網(wǎng)頁(yè)作業(yè)HTML電影網(wǎng)頁(yè)作業(yè)(HTML+CSS)

一、??作品介紹

HTML實(shí)例網(wǎng)頁(yè)代碼, 本實(shí)例適合于初學(xué)HTML的同學(xué)带斑。該實(shí)例里面有設(shè)置了css的樣式設(shè)置席噩,有div的樣式格局,這個(gè)實(shí)例比較全面捶朵,有助于同學(xué)的學(xué)習(xí),本文將介紹如何通過(guò)從頭開(kāi)始設(shè)計(jì)個(gè)人網(wǎng)站并將其轉(zhuǎn)換為代碼的過(guò)程來(lái)實(shí)踐設(shè)計(jì)蜘矢。


二狂男、??作品效果

??視頻演示

https://live.csdn.net/v/embed/239806

(title-A38JP 電影網(wǎng)站7頁(yè),不包含js 有登陸注冊(cè)品腹,表格 table布局 岖食,有的登錄注冊(cè)頁(yè)面,內(nèi)嵌 css)]

?? 截圖演示

07.png
06.png
05.png
04.png
03.png
02.png
01.png


三舞吭、?? 作品代碼

??HTML代碼



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

</head>
<body>
    <table class="nav">
        <tr height="60px">
            <td width="400px">
                <h1><a href="">影視大全</a></h1>
            </td>
            <td> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
            <td>
                <a href="">首頁(yè)</a>
            </td>
            <td>
                <a href="list.html">影視列表</a>
            </td>
            <td>
                <a href="juq.html">影視劇評(píng)</a>
            </td>
            <td>
                <a href="dec.html">影視介紹</a>
            </td>
            <td>
                <a href="login.html">登錄</a>
            </td>
            <td>
                <a href="re.html">注冊(cè)</a>
            </td>
            <td>
                <a href="my.html">我的</a>
            </td>
        </tr>
    </table>
    <img width="100%" height="500" src="picture/0.jpg" alt="">
    <div class="ban list">
        <a href="#">電視劇</a>
        <a href="#">綜藝</a>
        <a href="#">電影</a>
        <a href="#">院線大片</a>
        <a href="#">自制電影</a>
        <a href="#">動(dòng)漫</a>
        <a href="#">少兒</a>
        <a href="#">紀(jì)錄片</a>
        <a href="#">VIP會(huì)員</a>
        <a href="#">音樂(lè)</a>
        <a href="#">體育</a>
        <a href="#">愛(ài)看</a>
        <a href="#">娛樂(lè)</a>
        <a href="#">生活</a>
        <a href="#">新聞</a>
        <a href="#">教育</a>
        <a href="#">汽車</a>
        <a href="#">更多</a>
    </div>
    <div class="title">影視劇</div>
    <table>
        <tr height="450">
            <td width="240">
                <img width="224" src="picture/index.jpg" alt="">
                <h3>大明風(fēng)華 TV版</h3>
                <p>主演:湯唯/朱亞文</p>
            </td>
            <td width="240">
                <img width="224" src="picture/index1.jpg" alt="">
                <h3>鶴唳華亭</h3>
                <p>主演:羅晉/李一桐</p>
            </td>
            <td width="240">
                <img width="224" src="picture/index2.jpg" alt="">
                <h3>淑女飄飄拳</h3>
                <p>主演:畢雯珺/孫千</p>
            </td>
            <td width="240">
                <img width="224" src="picture/index3.jpg" alt="">
                <h3>未經(jīng)安排的青春</h3>
                <p>主演:黃宥明/余昊洋</p>
            </td>
            <td width="230">
                <img width="224" src="picture/index4.jpg" alt="">
                <h3>戀愛(ài)先生</h3>
                <p>主演:靳東/江疏影</p>
            </td>
        </tr height="450">
        <tr height="450">
            <td width="240">
                <img width="224" src="picture/index5.jpg" alt="">
                <h3>將軍在上</h3>
                <p>主演:馬思純 / 盛一倫</p>
            </td>
            <td width="240">
                <img width="224" src="picture/index6.jpg" alt="">
                <h3>微微一笑很傾城</h3>
                <p>主演:楊洋 / 鄭爽</p>
            </td>
            <td width="240">
                <img width="224" src="picture/index7.jpg" alt="">
                <h3>三生三世十里桃花</h3>
                <p>主演:楊冪 / 趙又廷</p>
            </td>
            <td width="240">
                <img width="224" src="picture/index8.jpg" alt="">
                <h3>白夜追兇 第一季</h3>
                <p>主演:潘粵明 / 王瀧正</p>
            </td>
            <td width="230">
                <img width="224" src="picture/index9.jpg" alt="">
                <h3>知否知否應(yīng)是綠肥紅...</h3>
                <p>主演:趙麗穎 / 馮紹峰</p>
            </td>
        </tr>
    </table>
    <div class="more">查看更多</div>
    <div class="footer">
        <div class="ban">
            <a href="#">優(yōu)酷</a>|
            <a href="#">土豆</a>|
            <a href="#">UC瀏覽器</a>|
            <a href="#">UC頭條</a>|
            <a href="#">阿里文學(xué)</a>|
            <a href="#">蝦米</a>|
            <a href="#">阿里星球</a>|
            <a href="#">阿里影業(yè)</a>|
            <a href="#">游戲</a>|
            <a href="#">鯨觀</a>
        </div>
        <div>影視版權(quán)信息</div>
    </div>
</body>
</html>


??CSS代碼



    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .nav{
            width: 100%;
            text-align: center;
            background: #333;
        }
        a{
            text-decoration: none;
            color: #eee;
        }
        .title{
            width: 1200px;
            font-size: 24px;
            font-weight: bold;
            margin: 40px auto 30px;
        }
        table{
            width: 1200px;
            margin: auto;
        }
        h3,p{
            margin: 12px;
        }
        .more{
            width: 120px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            border: 1px solid #ddd;
            margin: 40px auto 60px;
        }
        .list a{
            display: inline-block;
            color: #000;
            padding: 16px;
        }
        .footer{
            background: #333;
            color: #eee;
            padding: 40px 0;
            text-align: center;
        }
        .ban{
            width: 1200px;
            margin: 20px auto;
        }
        .footer a{
            padding: 0 20px;
        }
    </style>




四泡垃、??更多源碼

【干貨分享】自學(xué)編程的小伙伴可以前往我的 gitee 倉(cāng)庫(kù)(持續(xù)更新中...)

??【web學(xué)習(xí)指南】從web基礎(chǔ)、計(jì)算機(jī)基礎(chǔ)到前端常用框架的教程羡鸥,涵蓋前端大部分必備知識(shí)(學(xué)習(xí)指南 + 技術(shù)文章 + 資源分享)

Gitee倉(cāng)庫(kù)地址(來(lái)個(gè)Star吧~): https://gitee.com/zhanyuqiu2022/my-app

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末蔑穴,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子惧浴,更是在濱河造成了極大的恐慌存和,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,807評(píng)論 6 518
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件衷旅,死亡現(xiàn)場(chǎng)離奇詭異捐腿,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)柿顶,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,284評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門叙量,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人九串,你說(shuō)我怎么就攤上這事绞佩。” “怎么了猪钮?”我有些...
    開(kāi)封第一講書(shū)人閱讀 169,589評(píng)論 0 363
  • 文/不壞的土叔 我叫張陵品山,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我烤低,道長(zhǎng)肘交,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 60,188評(píng)論 1 300
  • 正文 為了忘掉前任扑馁,我火速辦了婚禮涯呻,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘腻要。我一直安慰自己复罐,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,185評(píng)論 6 398
  • 文/花漫 我一把揭開(kāi)白布雄家。 她就那樣靜靜地躺著效诅,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上乱投,一...
    開(kāi)封第一講書(shū)人閱讀 52,785評(píng)論 1 314
  • 那天咽笼,我揣著相機(jī)與錄音,去河邊找鬼戚炫。 笑死剑刑,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的双肤。 我是一名探鬼主播施掏,決...
    沈念sama閱讀 41,220評(píng)論 3 423
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼杨伙!你這毒婦竟也來(lái)了其监?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 40,167評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤限匣,失蹤者是張志新(化名)和其女友劉穎抖苦,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體米死,經(jīng)...
    沈念sama閱讀 46,698評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡锌历,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,767評(píng)論 3 343
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了峦筒。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片究西。...
    茶點(diǎn)故事閱讀 40,912評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖物喷,靈堂內(nèi)的尸體忽然破棺而出卤材,到底是詐尸還是另有隱情,我是刑警寧澤峦失,帶...
    沈念sama閱讀 36,572評(píng)論 5 351
  • 正文 年R本政府宣布扇丛,位于F島的核電站,受9級(jí)特大地震影響尉辑,放射性物質(zhì)發(fā)生泄漏帆精。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,254評(píng)論 3 336
  • 文/蒙蒙 一隧魄、第九天 我趴在偏房一處隱蔽的房頂上張望卓练。 院中可真熱鬧,春花似錦购啄、人聲如沸襟企。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,746評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)整吆。三九已至拱撵,卻和暖如春辉川,著一層夾襖步出監(jiān)牢的瞬間表蝙,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,859評(píng)論 1 274
  • 我被黑心中介騙來(lái)泰國(guó)打工乓旗, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留府蛇,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 49,359評(píng)論 3 379
  • 正文 我出身青樓屿愚,卻偏偏與公主長(zhǎng)得像汇跨,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子妆距,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,922評(píng)論 2 361

推薦閱讀更多精彩內(nèi)容