免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
整體結(jié)構(gòu)
HTML基礎(chǔ)設(shè)施
  • 文件應(yīng)以“<!DOCTYPE ......>”首行頂格開始,推薦使用“<!DOCTYPE html>”。
  • 必須申明文檔的編碼charset,且與文件本身編碼保持一致,推薦使用UTF-8編碼<meta charset="utf-8"/>。
  • 根據(jù)頁面內(nèi)容和需求填寫適當(dāng)?shù)膋eywords和description。
  • 頁面title是極為重要的不可缺少的一項(xiàng)。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>NEC:更好的CSS方案</title>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<meta name="viewport" content="width=device-width"/>
<link rel="stylesheet" href="css/style.css"/>
<link rel="shortcut icon" href="img/favicon.ico"/>
<link rel="apple-touch-icon" href="img/touchicon.png"/>
</head>
<body>
</body>
</html>
結(jié)構(gòu)順序和視覺順序基本保持一致
  • 按照從上至下、從左到右的視覺順序書寫HTML結(jié)構(gòu)。
  • 有時候?yàn)榱吮阌谒阉饕孀ト?,我們也會將重要?nèi)容在HTML結(jié)構(gòu)順序上提前。
  • 用div代替table布局,可以使HTML更具靈活性,也方便利用CSS控制。
  • table不建議用于布局,但表現(xiàn)具有明顯表格形式的數(shù)據(jù),table還是首選。
結(jié)構(gòu)、表現(xiàn)、行為三者分離,避免內(nèi)聯(lián)
  • 使用link將css文件引入,并置于head中。
  • 使用script將js文件引入,并置于body底部。
保持良好的簡潔的樹形結(jié)構(gòu)
  • 每一個塊級元素都另起一行,每一行都使用Tab縮進(jìn)對齊(head和body的子元素不需要縮進(jìn))。刪除冗余的行尾的空格。
  • 使用4個空格代替1個Tab(大多數(shù)編輯器中可設(shè)置)。
  • 對于內(nèi)容較為簡單的表格,建議將tr寫成單行。
  • 你也可以在大的模塊之間用空行隔開,使模塊更清晰。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<body>
<!-- 側(cè)欄內(nèi)容區(qū) -->
<div class="m-side">
    <div class="side">
        <div class="sidein">
            <!-- 熱門標(biāo)簽 -->
            <div class="sideblk">
                <div class="m-hd3"><h3 class="tit">熱門標(biāo)簽</h3> </div>
                ...
            </div>
            <!-- 最熱TOP5 -->
            <div class="sideblk">
                <div class="m-hd3"><h3 class="tit">最熱TOP5</h3> <a href="#" class="s-fc02 f-fr">更多?</a></div>
                ...
            </div>
        </div>
    </div>
</div>
<!-- /側(cè)欄內(nèi)容區(qū) -->
</body>
另外,請做到以下幾點(diǎn)
  • 結(jié)構(gòu)上如果可以并列書寫,就不要嵌套。

    如果可以寫成<div></div><div></div>那么就不要寫成<div><div></div></div>

  • 如果結(jié)構(gòu)已經(jīng)可以滿足視覺和語義的要求,那么就不要有額外的冗余的結(jié)構(gòu)。

    比如<div><h2></h2></div>已經(jīng)能滿足要求,那么就不要再寫成<div><div><h2></h2></div></div>

  • 一個標(biāo)簽上引用的className不要過多,越少越好。

    比如不要出現(xiàn)這種情況:<div class="class1 class2 class3 class4"></div>

  • 對于一個語義化的內(nèi)部標(biāo)簽,應(yīng)盡量避免使用className。

    比如在這樣一個列表中,li標(biāo)簽中的itm應(yīng)去除:<ul class="m-help"><li class="itm"></li><li class="itm"></li></ul>

本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
帶下拉菜單的按鈕
移動web最簡潔的滑動效果Swipe JS(適合初學(xué)者)
前端代碼標(biāo)準(zhǔn)最佳實(shí)踐:HTML篇
jQuery中prev()方法用法實(shí)例
詳解Bootstrap中JS插件實(shí)現(xiàn)下拉菜單效果
輕輕松松學(xué)CSS:媒體查詢
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服