成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

編碼規(guī)范-html.md

tomlingtm / 379人閱讀

摘要：寫在前面對于不同的編程語言來說，具體的編碼規(guī)范各不相同，但是其宗旨都是一致的，就是保證代碼在高質(zhì)量完成需求的同時具備良好的可讀性可維護(hù)性。減少標(biāo)簽的數(shù)量編寫代碼時，盡量避免多余的父元素。

寫在前面

對于不同的編程語言來說，具體的編碼規(guī)范各不相同，但是其宗旨都是一致的，就是保證代碼在高質(zhì)量完成需求的同時具備良好的可讀性、可維護(hù)性。

本文大部分內(nèi)容來自網(wǎng)上，僅供個人參考學(xué)習(xí)！

網(wǎng)絡(luò)上的知識浩如煙海，而學(xué)到了才是自己的?。?
然后，老規(guī)矩，帶上我們可愛的小伙伴...

語法

用兩個空格來代替制表符（tab） -- 這是唯一能保證在所有環(huán)境下獲得一致展現(xiàn)的方法。

嵌套元素應(yīng)當(dāng)縮進(jìn)一次（即兩個空格）。

對于屬性的定義，確保全部使用雙引號，絕不要使用單引號。

不要在自閉合（self-closing）元素的尾部添加斜線 -- HTML5 規(guī)范中明確說明這是可選的。

不要省略可選的結(jié)束標(biāo)簽（closing tag）（例如， 或 ）。

doctype

為每個 HTML 頁面的第一行添加標(biāo)準(zhǔn)模式（standard mode）的聲明，這樣能夠確保在每個瀏覽器中擁有一致的展現(xiàn)。

HTML5 doctype

HTML 4 doctype

Tips:
聲明不是 HTML 標(biāo)簽
告訴瀏覽器HTML文檔類型

文件兼容性模式

文件兼容性用于定義讓瀏覽器如何編譯你的網(wǎng)頁。此文件解釋文件兼容性，如何指定你網(wǎng)站的文件兼容性模式以及如何判斷一個網(wǎng)頁該使用的文件模式。

IE兼容行

說明:IE=Edge設(shè)置 通知IE以最高級別模式加載文檔;其他的有:11/10/9/8/7/5/EmulateIE11/EmulateIE10

chrome 優(yōu)先

說明:優(yōu)先使用最新版本的IE 和 Chrome 內(nèi)核

360極速模式 優(yōu)先

說明:優(yōu)先使用webkit內(nèi)核,IE兼容內(nèi)核,IE標(biāo)準(zhǔn)內(nèi)核

馬丹寫在最后

瀏覽器從前往后選擇,但是太麻煩了,改用IE=edge,為了兼容chrome使用chrome=1觸發(fā)Google Chrome Frame;但是馬丹,chrome最新版本已經(jīng)拋棄Google Chrome Frame了,所以最終使用IE=edge搞定.

瀏覽器內(nèi)核

Trident內(nèi)核
又稱其為IE內(nèi)核，是微軟開發(fā)的一種排版引擎。
瀏覽器產(chǎn)品: IE、傲游、世界之窗瀏覽器、Avant、騰訊TT、Netscape 8、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等

Gecko內(nèi)核
開源,以C++編寫的網(wǎng)頁排版引擎。
瀏覽器產(chǎn)品:Firefox、Netscape6至9

WebKit內(nèi)核
開源,目前流行的瀏覽器內(nèi)核,常見于Google和Mac的產(chǎn)品中.
瀏覽器產(chǎn)品:Safari、Chrome、傲游3、國內(nèi)各種瀏覽器

Presto內(nèi)核
Opera Software開發(fā)的瀏覽器排版引擎
瀏覽器產(chǎn)品:Opera 7.0以上

Tips : CSS3中各個瀏覽器內(nèi)核兼容的設(shè)置

- -moz-：代表FireFox瀏覽器私有屬性  
- -ms-：代表IE瀏覽器私有屬性  
- -webkit-：代表safari、chrome瀏覽器私有屬性  
- -o-：代表opera瀏覽器私有屬性  
    .class{
      border-radius:20px 40px 10px;
      -webkit-border-radius:20px 40px 10px;
      -moz-border-radius:20px 40px 10px;
      -ms-border-radius:20px 40px 10px;
      -o-border-radius:20px 40px 10px;
    }
sublime有插件可以自動生成:Autoprefixer

Tips : JS各個瀏覽器內(nèi)核兼性

其他問題

文件編碼格式
編寫文件時全部使用無BOM UTF-8模式,并指定瀏覽器文檔編碼方式.

引入 CSS 和 JavaScript 文件
根據(jù)HTML5規(guī)范,在引入CSS和JavaScript文件時一般不需要指定type屬性，因為text/css和text/javascript分別是它們的默認(rèn)值。非H5的加!

說明:js放文件底部,css放文件head

標(biāo)簽語義化
盡量遵循 HTML 標(biāo)準(zhǔn)和語義，但是不要以犧牲實用性為代價。任何時候都要盡量使用最少的標(biāo)簽并保持最小的復(fù)雜度。

減少標(biāo)簽的數(shù)量
編寫 HTML 代碼時，盡量避免多余的父元素。

少用JavaScript 生成的標(biāo)簽
通過 JavaScript 生成的標(biāo)簽讓內(nèi)容變得不易查找、編輯，并且降低性能。能避免時盡量避免。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/51128.html

相關(guān)文章

  • roadhog 生產(chǎn)環(huán)境支持靜態(tài)文件名加 hash 和 CDN 配置

    摘要：問題來源于思路使用來給文件加使用插件來給文件加使用插件來自動根據(jù)加的來引入對應(yīng)的和并生成文件安裝無需安裝因為已經(jīng)帶了版，如果自己安裝了版反而可能出問題。 問題來源于：https://github.com/sorrycc/ro... Workaround: 思路 使用 webpack output 來給 js 文件加 hash 使用插件 extract-text-webpack-plu...

    番茄西紅柿 評論0 收藏0

  • roadhog 生產(chǎn)環(huán)境支持靜態(tài)文件名加 hash 和 CDN 配置

    摘要：問題來源于思路使用來給文件加使用插件來給文件加使用插件來自動根據(jù)加的來引入對應(yīng)的和并生成文件安裝無需安裝因為已經(jīng)帶了版，如果自己安裝了版反而可能出問題。 問題來源于：https://github.com/sorrycc/ro... Workaround: 思路 使用 webpack output 來給 js 文件加 hash 使用插件 extract-text-webpack-plu...

    jsummer 評論0 收藏0

  • roadhog 生產(chǎn)環(huán)境支持靜態(tài)文件名加 hash 和 CDN 配置

    摘要：問題來源于思路使用來給文件加使用插件來給文件加使用插件來自動根據(jù)加的來引入對應(yīng)的和并生成文件安裝無需安裝因為已經(jīng)帶了版，如果自己安裝了版反而可能出問題。 問題來源于：https://github.com/sorrycc/ro... Workaround: 思路 使用 webpack output 來給 js 文件加 hash 使用插件 extract-text-webpack-plu...

    izhuhaodev 評論0 收藏0

  • HTML5-焦點管理

    摘要：移動的實質(zhì)則是切換焦點，所以我們需要去理解什么焦點。元素能夠被聚焦的元素，比如接下來我們需要了解一下屬性，這個很重要，沒有它實現(xiàn)不了焦點管理。在開發(fā)TV web 應(yīng)用時，發(fā)現(xiàn)在交互方式上和傳統(tǒng)web開發(fā)很不一樣。PC上的頁面上都是通過鼠標(biāo)進(jìn)行交互，而TV則不同，它是通過遙控器按鍵進(jìn)行交互，它有點擊、移動(上下左右)、返回、主頁等操作。移動的實質(zhì)則是切換焦點，所以我們需要去理解什么焦點。 f...

    233jl 評論0 收藏0

  • 作為一個前端工程師也要掌握的幾種文件路徑知識

    摘要：前言之前在做配置時候多次用到路徑相關(guān)內(nèi)容，最近在寫項目的時候，有一個文件需要上傳到阿里云的功能，同時本地服務(wù)器也需要保留一個文件備份。如果返回的路徑字符串長度為零，那么他會返回一個，代表當(dāng)前的文件夾。 showImg(https://segmentfault.com/img/bVbwElJ?w=480&h=204); 前言 之前在做webpack配置時候多次用到路徑相關(guān)內(nèi)容，最近在寫項...

    wslongchen 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<