配资炒股入配资平台-杠杠账户什么意思-【东方资本】,股票加杠杆会亏到负数吗为什么,今日财经最新消息,股票购买手续费

    電話

    0411-39943997

仟億科技
客服中心
  • 電話
  • 電話咨詢：0411-39943997
  • 手機(jī)
  • 手機(jī)咨詢:15840979770
    手機(jī)咨詢:13889672791
網(wǎng)絡(luò)營(yíng)銷 >更多
您現(xiàn)在的位置：首頁(yè) > 新聞中心 > 常見問題

專業(yè)HTML5的書寫原則

作者：billionnet 發(fā)布于:2013/3/3 18:31:10 點(diǎn)擊量：

 

一、一般原則

  • 所有的代碼應(yīng)看似出自一人之手，即使奶媽有多人。
  • 嚴(yán)格執(zhí)行約定的風(fēng)格。
  • 若風(fēng)格不定，使用現(xiàn)有、常用風(fēng)格。

二、格式

  • 標(biāo)簽以及屬性名稱總是小寫。
  • 一行一個(gè)不連續(xù)元素。
  • 每個(gè)嵌套元素使用一個(gè)額外的縮進(jìn)。
  • 布爾屬性無(wú)值（如checked而不是checked="checked"）。
  • 屬性值總是使用雙引號(hào)引起來。
  • 省略link樣式表、style以及script元素的type屬性。
  • 總是包含結(jié)束標(biāo)簽。
  • 自閉元素(img, br)不要包含斜杠。

（每行長(zhǎng)度保持一個(gè)最大的合理值，例如 80列）

例子:

?
1
2
3
4
5
6
7
<div class="tweet">
    <a href="path/to/somewhere">
        <img src="path/to/image.png" alt="">
    a>
    <p>[微博文字]p>
    <button disabled>回復(fù)button>
div>

異常和輕微的偏差
元素含有多個(gè)屬性，可以跨多行排版，以努力提高可讀性以及提供更多有用的差異。

例子:

?
1
2
3
4
5
6
<a class="[value]"
 data-action="[value]"
 data-id="[value]"
 href="[url]">
    <span>[文字]span>
a>

三、屬性順序

HTML屬性應(yīng)該以特定的屬性排列，（如下）這可以某種程度上反應(yīng)類名是主要接口——用做CSS以及JavaScript選擇元素

  1. class
  2. id
  3. data-*
  4. 其他

例子:

?
1
<a class="[value]" id="[value]" data-name="[value]" href="[url]">[文字]a>

四、空白

你的整個(gè)源代碼應(yīng)該只存在一種風(fēng)格?？瞻资褂们昂笠恢?，使用空白提高可讀性。

  • 到死也不要混用空格符(spaces)和制表符(tabs)實(shí)現(xiàn)縮進(jìn)。
  • 柔和縮進(jìn)(spaces)或真實(shí)制表二選一，關(guān)鍵要一站到底。（個(gè)人偏好：空格-spaces）
  • 如果使用空格，選定一個(gè)縮進(jìn)字符值。（個(gè)人偏好：4空格）

小提示：你可以配置編輯器“顯示不可見”(“show invisibles”)，此舉可用來消除結(jié)束行的空白，避免違背上面（堅(jiān)持一種縮進(jìn)）的承諾。

五、命名

命名很難，但很重要。這是開發(fā)一個(gè)可維護(hù)的代碼庫(kù)重要的組成部分，并確保您HTML和CSS/JS見有個(gè)可伸縮的接口。

  • 使用清晰，周到，適當(dāng)?shù)腍TML類名。名稱應(yīng)該體現(xiàn)HTML和CSS文件的信息。
  • 避免很系統(tǒng)地使用類名縮寫，這會(huì)讓事情變得難以理解。

下面是糟糕的命名：

?
1
<div class="cb s-scr">div>
?
1
2
3
4
5
6
7
.s-scr {
  overflow: auto;
}
 
.cb {
  background: #000;
}

這是更好一點(diǎn)的命名：

?
1
<div class="column-body is-scrollable">div>
?
1
2
3
4
5
6
7
.is-scrollable {
    overflow: auto;
}
 
.column-body {
    background: #000;
}

六、實(shí)例

含各種約定的例子：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html>
    <head>
        <meta charset="utf-8">
        <title>文檔title>
        <link rel="stylesheet" href="main.css">
        <script src="main.js">script>
    head>
    <body>
        <article class="post" id="1234">
            <time class="timestamp">2013年1月4日time>
            <a data-id="1234"
             data-analytics-category="[value]"
             data-analytics-action="[value]"
             href="[url]">[文本]a>
            <ul>
                <li>
                    <a href="[url]">[文本]a>
                    <img src="[url]" alt="[文本]">
                li>
                <li>
                    <a href="[url]">[文本]a>
                li>
            ul>
 
            <a class="link-complex" href="[url]">
                <span class="link-complex__target">[文本]span>
                [文本]
            a>
 
            <input value="text" readonly>
        article>
    body>
html>

 



分享到：

Copyright@ 2011-2016 版權(quán)所有：大連千億科技有限公司 遼ICP備11013762-3號(hào)   google網(wǎng)站地圖   百度網(wǎng)站地圖   網(wǎng)站地圖

公司地址：大連市沙河口區(qū)中山路692號(hào)辰熙星海國(guó)際2317 客服電話：0411-39943997 QQ：2088827823 37482752

法律聲明：未經(jīng)許可，任何模仿本站模板、轉(zhuǎn)載本站內(nèi)容等行為者，本站保留追究其法律責(zé)任的權(quán)利！ 隱私權(quán)政策聲明