WEB前端編碼規(guī)范
上傳人：文***
文檔編號(hào)：25508059
上傳時(shí)間：2021-07-26
格式：DOCX
頁數(shù)：47
大?。?57.68KB
收藏
版權(quán)申訴
舉報(bào)
下載
第1頁 / 共47頁
第2頁 / 共47頁
第3頁 / 共47頁
資源描述：
和<TITLE>是不同的標(biāo)簽。
具體規(guī)范如下：
1. 文件定義
<!DOCTYPE html PUBLIC -"http://W3C//DTD XHTML 1.0 Strict//EN" ""> <html xmlns="">
<head>
<meta http -equiv="Content -Type" content="text/html; charset=utf -8" />
</p>
<p >4、
2. 網(wǎng)站 head 區(qū)代碼規(guī)范：
head 區(qū)是指 <head>和</head> 之間的內(nèi)容。必須加入的標(biāo)簽：
2.1 公司版權(quán)注釋
<!---
文件： XXX.html
說明：說明本 HTML 是用于什么功能
作者：李四
時(shí)間： 2016/1/30
--->
2.2 網(wǎng)頁顯示字符集
簡體中文 ： <meta http-equiv="Content-Type" content="text/html;
charset= utf-8 ">
繁體中文： <me</p>
<p >5、ta http-equiv="Content-Type" content="text/html;
charset= BIG5">
英 語： <meta http-equiv="Content-Type" content="text/html; charset= iso-8859-1 ">
2.3 作者與版權(quán)信息
此處用于存儲(chǔ)開發(fā)公司版權(quán)信息，如：
<meta name="author" content="">
<meta name="copyright" content=", 版權(quán)所有 "/>
2.4 網(wǎng)頁的 c</p>
<p >6、ss,javascript 規(guī)范
在引用 CSS和 JS文件時(shí)，統(tǒng)一放置在 <head></head> 中，先放 CSS引用，再放 js 引用。
<link href="style/style.css" rel="stylesheet" type="text/css" />
html 中 javascript 的書寫：
<script language="javascript" type="text/javascript"></script>
2.5 網(wǎng)頁標(biāo)題
Title 中使用“ - ”分割，如：設(shè)備管理平臺(tái) - 運(yùn)維系統(tǒng)</p>
<p >7、。
2.6 設(shè)置搜索關(guān)鍵詞
<meta name="keywords" content=" " />
百度關(guān)鍵詞搜索指數(shù)： ，在這個(gè)工具里， 可以看到一些常用關(guān)鍵詞的每日搜
索次數(shù)。
熱門詞匯，目前收索量最多的詞匯?？梢圆榭窗俣葻嵩~榜，
Google AdWords 關(guān)鍵字工具：查詢特定關(guān)鍵詞的常見查詢及擴(kuò)展匹配。
KEYWRODS關(guān)鍵字最多不超過 5 個(gè)建議長度：小于等于 100 個(gè)漢字，如果使用的網(wǎng)頁編碼是 UTF-8，不同關(guān)鍵字之間用英文“ , ”分隔。
2.7 網(wǎng)站簡介
</p>
<p >8、
<meta name="description" content=" " />
description 是描述網(wǎng)頁內(nèi)容的， 因此最好是可以用一句話來概括本網(wǎng)頁的
主題內(nèi)容。
description 不要超過 255 個(gè)字符，搜索引擎索引一般都會(huì)索引 Description 的前 255 個(gè)字符，因此，這 255 個(gè)字符是做搜索引擎優(yōu)化的關(guān)鍵。
如果使用的網(wǎng)頁編碼是 UTF-8，那么在 Description 中的標(biāo)點(diǎn)符號(hào)最好都使
用英文，例如英文的逗號(hào)、句號(hào)等。如果是中文的話，那么就使用中文的標(biāo)點(diǎn)符
號(hào)即可。
2.</p>
<p >9、8 其它標(biāo)簽 [ 非必需 ]
1. 設(shè)定網(wǎng)頁的到期時(shí)間。 一旦網(wǎng)頁過期， 必須到服務(wù)器上重新調(diào)閱， 這樣有利于頁面信息。
<meta http -equiv="expires" content="wed, 26 feb 2009 08:21:57 gmt">
2. 禁止瀏覽器從本地機(jī)的緩存中調(diào)閱頁面內(nèi)容。
<meta http -equiv="pragma" content="no -cache">
3. 用來防止別人在框架里調(diào)用你的頁面。
<meta http -equiv="window -target" content="_to</p>
<p >10、p">
4. 自動(dòng)跳轉(zhuǎn)。
<meta http -equiv="refresh" content="5;url="> 5 指時(shí)間停留 5 秒。
5. 網(wǎng)頁搜索機(jī)器人向?qū)?. 用來告訴搜索機(jī)器人哪些頁面需要索引，哪些頁面不需要索引。
<meta name="robots" content="none">
CONTENT的參數(shù)有 all,none,index,noindex,follow,nofollow 。默認(rèn)是 all 。
6. 收藏夾圖標(biāo)
<link rel="shortcut icon" href="/favicon.i</p>
<p >11、co" type="image/x -icon"/> 圖片大小 16px*16px
7. 訂閱 RSS瀏覽
是一種描述和同步網(wǎng)站內(nèi)容的格式。用戶可以通過 RSS閱讀器訂閱。
<link href= ”abc.aspx” title= ”新現(xiàn)代教育網(wǎng)” type=”application/rss+xml ” rel= ”alternte ” />
2.9 完整示例
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>12、
3. html 中元素的書寫：
<body>區(qū)域標(biāo)簽
3.1 段落
段落使用 <p> 標(biāo)簽進(jìn)行定義。
<p>This is a paragraph</p>
3.2 標(biāo)題
即正文標(biāo)題一般用 <h1></h1>標(biāo)簽，最好和 title 標(biāo)簽的內(nèi)容有關(guān)聯(lián)。
標(biāo)題使用 <h1> 至 <h6> 標(biāo)簽進(jìn)行定義。 <h1> 定義最大的標(biāo)題。 <h6> 定義
最小的標(biāo)題。
<h1>This </p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>13、is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>
文章中的小標(biāo)題一定也要加粗。
可以把網(wǎng)頁中的重要內(nèi)容做成這樣。 用戶不用登陸這個(gè)網(wǎng)頁就可看到更新的內(nèi)容。
3.3 字體的設(shè)置標(biāo)簽
換行： <br/>
字體修飾不要使用 <font><strong</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>14、> 等進(jìn)行標(biāo)注，一般使用 css 樣式進(jìn)行字體
樣式排版
3.4 注意事項(xiàng)
1.<body> 為了保證瀏覽器的兼容性 ，必須設(shè)置頁面背景：
<body bgcolor="#FFFFFF">
2. 關(guān) 所有的
打開的 必 關(guān) ，例如 <p></p>，當(dāng)然 有一種關(guān) 方式，如： <br/> 。
即：一定要有 束 。
3. 屬性 用雙引號(hào) “” 括起來 , 屬性 一使用小寫
例如： <img height="60" width="760" src="images/lo</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>15、go.gif"/>
4. 所有的屬性
不正確的寫法： <input ?? checked />
正確的寫法 ： <input ?? checked= "checked"/>
5. 要合理嵌套
不正確的寫法： <div><h1> </div></h1>
正確的寫法 ： <div><h1></h1></div>
7. 特殊字符用
如 " <" 用 "<" 表示， " >" 用 ">" 表示。
8. 網(wǎng) 中 片 化
一定要加 alt 屬性，al</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>16、t 屬性指定了當(dāng) 片不能 示的 候就 示供替 文本。 內(nèi)容最好與關(guān) 相關(guān)。
如： <img src="images/logo.gif" alt=" 網(wǎng)站 LOGO"/>
一些小 最好用 .png 或 .gif 格式 片，比如 箭 ，文章列表前的 等，在 CSS中做成背景。 些小 最好做一 片，用 CSS來定位。
9. 用 構(gòu)化的元素 出內(nèi)容
<ul>
<li>新現(xiàn)代 </li>
<li>新現(xiàn)代 </li>
<li>新現(xiàn)代 </li>
</ul>
或者使用
<dl>
<dt><</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>17、/dt>
<dd></dd>
</dl>
10． 標(biāo)簽要有縮進(jìn)，便于代碼閱讀修改 。
11、 tr 、td 必須定義在 table 之間；
<table>
<tbody>
<tr>
<td> ?? </td>
? .
</tr>
</tbody>
</table>
注： tbody 絕對(duì)不可以省略 。
12、 button 按鈕必須定義在 form 之間，否則 netscape 不支持；
<form action= ”??” method= ” post ”</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>18、>
<input type= ” button ” name= ” but ” value= ” back ”> </form>
13、 html 注釋
(1) 每一獨(dú)立部分都要表明注釋。例如：
<! —右邊 begin--> <!-- 右邊 end-->
<! —左邊 begin--> <! —左邊 end-->
塊代碼的注釋
<! —頭部 begin-->
大量代碼塊，使用此種樣式，方便閱讀
<! —頭部 end-->
(2) 注釋要用描述性語言，能夠清楚的表達(dá)每一部分的意思。
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>19、
4. HTML 元素的排序規(guī)則
能夠使用的 HTML元素包括： div 、p、ul 、table 、span、input 、select 等。基本上 div 、table 、ul 、p 都屬于結(jié)構(gòu)性比較強(qiáng)的元素，而 span、input 則是比較弱的元素，因此不允許有 span 嵌套 div 、 table 等等的情況出現(xiàn)， span 可以嵌套 input, 可以嵌套 span。
在寫頁面的時(shí)候可以先不考慮界面呈現(xiàn)， 按照這樣的規(guī)則， 把數(shù)據(jù)直接綁定到 HTML元素的節(jié)點(diǎn)上。
5. 九大原則
原則一：
一般要寫兼容多種瀏覽器的</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>20、網(wǎng)頁， 最省事的方法就先寫適合 chrome 的樣式，并在 chrome 進(jìn)行調(diào)度。測(cè)試時(shí)可以使用多種瀏覽器。
原則二：
逐步疊加的方式，如果需要用這個(gè)樣式的模塊很多， 并且會(huì)存在些許的不同，千萬不要把樣式一步寫到位， 最好把框架性的先寫好， 細(xì)節(jié)性的留到第二個(gè)步驟，甚至第三個(gè)步驟，當(dāng)然最好步驟不要超過三步，這樣很不利于維護(hù)。
由若干個(gè)二級(jí)定義對(duì)一級(jí)定義進(jìn)行補(bǔ)充， 這樣的既可以減少代碼， 又可以減少繁多的 CLASS命名。
不要輕易修改共用的 CSS，否則可能會(huì)影響其它頁面。
在每個(gè)一級(jí) CSS前添加注釋，說明哪些頁面使用了該 CSS。
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>21、
原則三：
從總到分。順序應(yīng)該是這樣：總體需要用到的 >>結(jié)構(gòu) >>模塊 >>二級(jí)模塊 >> 細(xì)節(jié)；并且這個(gè)文檔最不容易修改的處于最上端， 頻繁用于修改的在末端。 最忌諱即興發(fā)揮， 這樣寫出的東西經(jīng)不起推敲， 稍有變化就要忙得亂成一團(tuán)。 結(jié)構(gòu)性的東西應(yīng)該慎重精細(xì)。
原則四：
盡量把能夠放在一組的小圖標(biāo)或者圖片放在一個(gè)圖片文件里， 這樣的好處有很多。
1、 圖片文件的總量會(huì)變?。?
2、利于下載，太多的小圖片下載效果是不理想的，常常會(huì)發(fā)現(xiàn)這個(gè)圖片出
來，那個(gè)沒出來， 這樣在寫樣式的時(shí)候只需要寫一個(gè)總體的， 對(duì)于具體的要顯</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>22、示
的只需要標(biāo)一個(gè)位置，非常省時(shí)間，樣式也很精煉；
3、 顯而易見，這樣做非常便于管理，替換或新增的時(shí)候工作量很小。
原則五：
切圖的原則， 應(yīng)該切大的圖絕不切小， 應(yīng)該切小的絕不切大， 能夠用顏色代替的絕不切圖。 把一個(gè)大圖切成很多份并不一定能夠加快頁面的顯示速度， 相反會(huì)浪費(fèi)很多不必要的帶寬。 不光要控制圖片文件的多少， 還要考慮到這樣切會(huì)不會(huì)造成頁面增加許多額外的代碼。
原則六：
圖片使用能名稱表達(dá)圖片意義的名詞命名，盡量不要使用編號(hào)命名。
原則七：
涉及多行多列的特別是列寬有不固定的，堅(jiān)決用表格，千萬不要為</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>23、了 DIV
而 DIV。
多個(gè)圖片規(guī)則排列時(shí)，可以使用 <dl><dt></dt><dd></dd></dl> 。
原則八：
盡可能不把樣式直接寫到元素的標(biāo)簽里（ 除非這個(gè)樣式出現(xiàn)的幾率特別小，有相當(dāng)程度的偶然性 ）。
原則九：
盡量不要用 ID 來定義或索引樣式， ID 的唯一性比較高，且用 ID 索引樣式
效率非常低而且兼容性的問題也比較明顯。
6．文件命名原則
6.1 前臺(tái)文件組織
在前臺(tái)頁面文件中，每個(gè)大類功能</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>24、模塊（子系統(tǒng)）單獨(dú)創(chuàng)建一個(gè)文件夾，使
用與之相關(guān)的有意義的英文名詞命名。 例如有一個(gè)系統(tǒng)包括后臺(tái)管理 （admin）、
前臺(tái)商城（ shop）、會(huì)員中心（ member）和商家中心（ store ）等子系統(tǒng)，文件
夾組織：
每個(gè)子系統(tǒng)中應(yīng)該包含一個(gè)缺省的 html 文件，文件名統(tǒng)一用 index.html ，即當(dāng)用戶缺省訪問該目錄時(shí)，自動(dòng)加載該頁面。
公用頁面（如登錄 login.html 、頁頭 header.html 、頁腳 footer.html 、導(dǎo)
航 navigation.</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>25、html 、菜單 menu.html 、信息 / 錯(cuò)誤提示 message.html 等），可以統(tǒng)一放在 common目錄中。
6.2 頁面命名規(guī)則
具有管理功能的頁面，如用名、角色、設(shè)備、日志、文章等的管理，可以歸
納為列表（ list.htm ）、新建（ add.html ）、編輯（ edit.html ）等幾類操作，
所以在頁面組織時(shí)， 每類模塊單獨(dú)創(chuàng)建一個(gè)文件夾， 使用能夠表達(dá)模塊意義的英
文名詞命名，并在其中分別創(chuàng)建 list.html 、add.html 、 edit.html 等文件，對(duì)
應(yīng)于內(nèi)容列表、添加、編輯等操作。</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>26、示例：
其它說明：
1. 在列表頁面里統(tǒng)一使用“四欄式”顯示風(fēng)格，即列表頁面里必須包括模塊目錄 / 位置提示、工具欄（含添加、編輯、刪除、刷新、查詢等操作控件）、表格、分頁操作等部分。示例：
2. 表格用于顯示查詢內(nèi)容，在 list.html 打開時(shí)，必須默認(rèn)加載一定的記錄；表格欄目僅</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>27、顯示用戶常用或關(guān)心的字段； 在顯示時(shí)必須對(duì)表格內(nèi)容進(jìn)行必要的格式處理；對(duì)記錄常用的操作可以放置于操作欄內(nèi) （如上圖中的操作欄內(nèi)放置有編輯和刪除兩個(gè)操作按鈕）。
3. 表格可以統(tǒng)一使用 easyui datagrid 或 bootstap data tables 。
6.3. 資源文件的命名原則
資源文件包括 css 、js 、圖片等內(nèi)容。所有資源文件統(tǒng)一存儲(chǔ)在 web 根目錄
resource 文件夾中。示例：
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>28、
每個(gè)子系統(tǒng)（大類）文件夾命名規(guī)則同 6.1 規(guī)則。
每個(gè)子系統(tǒng)文件夾中分別包括 css 、 js 和 images，示例：
多個(gè)子系統(tǒng)公共使用的資源，統(tǒng)一存儲(chǔ)在 common文件夾中，如常用的 js 操作，可以命名為 generic.js ，放置在 common/js/generic.js 。
6.3 圖片命名規(guī)則
圖片分成兩部分， 一是網(wǎng)頁設(shè)計(jì)時(shí)使用的靜態(tài)資源， 通常不會(huì)因系統(tǒng)的運(yùn)行而發(fā)生變化，另一類是程序生成、用戶上傳、終端上傳的圖片。
（</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>29、1）靜態(tài)圖片存儲(chǔ)在 大類目錄 \images 中，使用能表達(dá)圖片意
義的英文單詞命名， 不能使用圖片編號(hào)命名。 網(wǎng)面使用的小圖標(biāo)， 可以放置在一個(gè)圖片文件中，使用 css 裁切和背景方式顯示在頁面中。
（2）動(dòng)態(tài)圖片存儲(chǔ)在 resources\upload 目錄中，在其中創(chuàng)建分類圖片目錄。
例如，與系統(tǒng)相關(guān)的圖片存儲(chǔ)在 system 目錄中，設(shè)備監(jiān)控相關(guān)圖片存儲(chǔ)在
management 中等。為了避免同一文件夾中文件數(shù)量限制，在分類目錄中，按上
傳日期分成不同的次級(jí)目錄， 命名規(guī)則為上傳文件所在的 yyyyMM（年度月份），其中月份使用</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>30、兩位數(shù)字表示。例如：
上傳的圖片統(tǒng)一使用 GUID標(biāo)識(shí)進(jìn)行命名， 即在上傳時(shí)，由接收的 java 程序自動(dòng)生成 guid 編號(hào) +. 圖片擴(kuò)展名進(jìn)行命名。
注意：保存圖片時(shí)，文件擴(kuò)展名必須保持不變。示例：
7. 常用 HTML標(biāo)識(shí)符
HTML 標(biāo)記一覽 :
標(biāo)記
類型
譯名或意義
作 用
備注
文件標(biāo)記
<HTML>
●
文件聲明
讓瀏覽器知道這是 HTML 文件
<HEAD>
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>31、●
開頭
提供文件整體資訊
<TITLE>
●
標(biāo)題
定義文件標(biāo)題，將顯示于瀏覽頂端
<BODY>
●
本文
設(shè)計(jì)文件格式及內(nèi)文所在
排版標(biāo)記
<!-- 注解 -->
○
說明標(biāo)記
為文件加上說明，但不被顯示
<P>
○
段落標(biāo)記
為字、畫、表格等之間留一空白行
<BR>
○
換行標(biāo)記
令字、畫、表格等顯示于下一行
<HR>
○
水平線
插入一條水平線
<CENTER>
●
居中
令字、畫、表格等顯示于中間
反對(duì)
<PRE>
●
預(yù)設(shè)格式
令文件按照原始碼的排列方式顯示
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>32、<DIV>
●
區(qū)隔標(biāo)記
設(shè)定字、畫、表格等的擺放位置
<NOBR>
●
不折行
令文字不因太長而繞行
<WBR>
●
建議折行
預(yù)設(shè)折行部位
字體標(biāo)記
<STRONG>
●
加重語氣
產(chǎn)生字體加粗 BOLD 的效果
<B>
●
粗體標(biāo)記
產(chǎn)生字體加粗的效果
<EM>
●
強(qiáng)調(diào)標(biāo)記
字體出現(xiàn)斜體效果
<I>
●
斜體標(biāo)記
字體出現(xiàn)斜體效果
<TT>
●
打字字體
COURIER字體，字母寬度相同
<U>
●
加上底線
加上底線
反對(duì)
<H1>
●
一級(jí)標(biāo)題標(biāo)記
變</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>33、粗變大加寬，程度與級(jí)數(shù)反比
<H2>
●
二級(jí)標(biāo)題標(biāo)記
將字體變粗變大加寬
<H3>
●
三級(jí)標(biāo)題標(biāo)記
將字體變粗變大加寬
<H4>
●
四級(jí)標(biāo)題標(biāo)記
將字體變粗變大加寬
<H5>
●
五級(jí)標(biāo)題標(biāo)記
將字體變粗變大加寬
<H6>
●
六級(jí)標(biāo)題標(biāo)記
將字體變粗變大加寬
<FONT>
●
字形標(biāo)記
設(shè)定字形、大小、顏色
反對(duì)
<base href="http://weibangfood.com.cn/"/> ○
基準(zhǔn)字形標(biāo)記
設(shè)定所有字形、大小、顏色
反對(duì)
<BIG>
●
字體加大
令字體稍為加大
<SMALL>
●
字體縮細(xì)
令字體</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>34、稍為縮細(xì)
<STRIKE>
●
畫線刪除
為字體加一刪除線
反對(duì)
<CODE>
●
程式碼
字體稍為加寬如 <TT>
<KBD>
●
鍵盤字
字體稍為加寬，單一空白
<SAMP>
●
范例
字體稍為加寬如 <TT>
<VAR>
●
變數(shù)
斜體效果
<CITE>
●
傳記引述
斜體效果
<BLOCKQUOTE>●
引述文字區(qū)塊
縮排字體
<DFN>
●
述語定義
斜體效果
<ADDRESS>
●
地址標(biāo)記
斜體效果
<SUB>
●
下標(biāo)字
下標(biāo)字
<SUP>
●
上標(biāo)字
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>35、
指數(shù)（平方、立方等）
清單標(biāo)記
<OL>
●
順序清單
清單項(xiàng)目將以數(shù)字、字母順序排列
<UL>
●
無序清單
清單項(xiàng)目將以圓點(diǎn)排列
<LI>
○
清單項(xiàng)目
每一標(biāo)記標(biāo)示一項(xiàng)清單項(xiàng)目
<MENU>
●
選單清單
清單項(xiàng)目將以圓點(diǎn)排列，如 <UL>
反對(duì)
<DIR>
●
目錄清單
清單項(xiàng)目將以圓點(diǎn)排列，如 <UL>
反對(duì)
<DL>
●
定義清單
清單分兩層出現(xiàn)
<DT>
○
定義條目
標(biāo)示該項(xiàng)定義的標(biāo)題
<DD>
○
定義內(nèi)容
標(biāo)示定義內(nèi)容
表格標(biāo)記
<TA</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>36、BLE>
●
表格標(biāo)記
設(shè)定該表格的各項(xiàng)參數(shù)
<CAPTION>
●
表格標(biāo)題
做成一打通列以填入表格標(biāo)題
<TR>
●
表格列
設(shè)定該表格的列
<TD>
●
表格欄
設(shè)定該表格的欄
<TH>
●
表格標(biāo)頭
相等于 <TD>，但其內(nèi)之字體會(huì)變粗
表單標(biāo)記
<FORM>
●
表單標(biāo)記
決定單一表單的運(yùn)作模式
<TEXTAREA> ●
文字區(qū)塊
提供文字方盒以輸入較大量文字
<INPUT>
○
輸入標(biāo)記
決定輸入形式
<SELECT>
●
選擇標(biāo)記
建立 POP-UP 卷動(dòng)清單
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>37、
<OPTION>
○
選項(xiàng)
每一標(biāo)記標(biāo)示一個(gè)選項(xiàng)
圖形標(biāo)記
<IMG>
○
圖形標(biāo)記
用以插入圖形及設(shè)定圖形屬性
連結(jié)標(biāo)記
<A>
●
連結(jié)標(biāo)記
加入連結(jié)
<BASE>
○
基準(zhǔn)標(biāo)記
可將相對(duì) URL 轉(zhuǎn)絕對(duì)及指定連結(jié)目標(biāo)
框架標(biāo)記
<FRAMESET> ●
框架設(shè)定
設(shè)定框架
<FRAME>
○
框窗設(shè)定
設(shè)定框窗
<IFRAME>
○
頁內(nèi)框架
于網(wǎng)頁中間插入框架
IE
<NOFRAMES> ●
不支援框架
設(shè)定當(dāng)瀏覽器不支援</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>38、框架時(shí)的提示
影像地圖
<MAP>
●
影像地圖名稱 設(shè)定影像地圖名稱
<AREA>
○
連結(jié)區(qū)域
設(shè)定各連結(jié)區(qū)域
多媒體
<BGSOUND>
○
背景聲音
于背景播放聲音或音樂
IE
<EMBED>
○
多媒體
加入聲音、音樂或影像
其他標(biāo)記
<MARQUEE>
●
走動(dòng)文字
令文字左右走動(dòng)
IE
<BLINK>
●
閃爍文字
閃爍文字
NC
<ISINDEX>
○
頁內(nèi)尋找器
可輸入關(guān)鍵字尋找于該一頁
反對(duì)
<META>
○
開頭定義
讓瀏覽器知道這</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>39、是 HTML 文件
<LINK>
○
關(guān)系定義
定義該文件與其他 URL 的關(guān)系
STYLESHEET
<STYLE>
●
樣式表
控制網(wǎng)頁版面
<SPAN>
●
自訂標(biāo)記
獨(dú)立使用或與樣式表同用
注：
? ● 表示該標(biāo)記屬圍堵標(biāo)記，即需要關(guān)閉標(biāo)記如 </ 標(biāo)記 >。
? ○ 表示該標(biāo)記屬空標(biāo)記，即不需要關(guān)閉標(biāo)記。
? IE 表示該標(biāo)記只適用于 INTERNET EXPLORER。
? NC 表示該標(biāo)記只適用于 NETSCAPE COMMUNICATOR。
? 反對(duì) 表示該標(biāo)記不為 </p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>40、W3C 所贊同，通常這標(biāo)記是 IE 或 NC 自訂，且己為眾所支 持，只是 HTML 標(biāo)準(zhǔn)中有其它同功能或更好的選擇。
棄用 表示該標(biāo)記己為 W3C 所棄用，是過時(shí)的標(biāo)記，但 HTML 具向下兼容的特 性，
不用擔(dān)心新瀏覽器不支援舊標(biāo)記。
第二部分 CSS編碼規(guī)范
1. 基本書寫規(guī)范
1.1 所有的 CSS的盡量采用外部調(diào)用
<LINK href="/style/style.css" rel="stylesheet" type="text/css">
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>41、
書寫時(shí)重定義的最先，偽類其次，自定義最后（其中
a:hover a:actived 要按照順序?qū)懀┍阌谧约汉退碎喿x。
a:link a:visited
為了保證不同瀏覽器上字號(hào)保持一致，字號(hào)建議用點(diǎn)數(shù)
pt
和像素
px
來定
義，pt 一般使用中文宋體的 9pt 和 11pt ，px 一般使用中文宋體 12px 和 14.7px
這是經(jīng)過優(yōu)化的字號(hào)，黑體字或者宋體字加粗時(shí)，一般選用
11px 和 14.7px
的
字號(hào)比較合適。
字</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>42、體選擇： 優(yōu)先使用微軟雅黑，其次為宋體，可以統(tǒng)一在自定義樣式中，不需要重復(fù)定義字體。如：
body 中定義 ，而
1.2 CSS 推薦模板
body
{
font-size
: 9pt
; font-family
: Arial, Helvetica, sans-serif
; color
: #333333
; text
-align
: center
;
margin
: 0px ;}
ul {</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>43、 margin
: auto
; }
img
{
border
: 0px
;
}
a { font-size
: 9pt ; text-decoration
: none
; color
: #FFFFFF
;
}
a:hover
{
font-size
: 9pt ; text-decoration
: underline
; color
: #990000
; }
a.1 { font-size
: </p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>44、9pt
; color
: #3366cc
; text-decoration
: none }
a.1:hover
{
font-size
: 9pt
;
color
: #FF9900
;
text-decoration
: none
}
.colorblue,colorblue:hover
{ color
: #003366
;} .blue
{
font-family
: " 宋體 " ;
font-si
ze : 9pt ; line-height
: 20px
;
color
: #0099FF
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>45、;
letter-spacing
: 5em }
.colorRed,a.colorRed:hover
{ color
: #FF0000
; } .colorLime,a.colorLime:hover
{ co
lor : #00FF00
; } .colorGreen,a.colorGreen:hover
{ color
: #008000
; } .colorBlue,a.c
olorBlue:hover
{ </p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>46、 color
: #0000FF
; } .colorOrange,a.colorOrange:hover
{ color
: #FF
A500 ; }
為了保證瀏覽器的兼容性，必須設(shè)置頁面背景
<body bgcolor="#FFFFFF">
1.3 CSS 注釋寫法
在定義的 CSS文件頂部添加文件說明、作者、時(shí)間等說明，如例：
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>47、
一級(jí) CSS上面必須加上注釋，說明樣式的用處。必要時(shí)可以添加作者、創(chuàng)建時(shí)間、修改人、修改時(shí)間。示例：
2.CSS命名參考
CSS文件名統(tǒng)一使用小寫英文單詞命名。
樣式定義變量統(tǒng)一使用 class 命名方式，不建議使用 id 命名方式 。如下圖中，使用“ . ”定義的樣式為 class 命名方式，使用“ #”引導(dǎo)的樣式為 id 命名方式。 Id 命名方式僅針對(duì)于 html 中使用 id 定義的元素，通常復(fù)用性較差。
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>48、
2.1 常用的 CSS命名規(guī)則：
頭： header
內(nèi)容： content/container
尾： footer
導(dǎo)航： nav
側(cè)欄： sidebar
容 器： container/box
主 導(dǎo) 航： mainNav
子 導(dǎo) 航： subNav
頂 導(dǎo) 航： topNav
網(wǎng)站標(biāo)志： logo
大 廣 告： banner
頁面中部： mainBody
菜 單： menu
菜單內(nèi)容： menuContent
子 菜 單： subMenu
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>49、
子菜單內(nèi)容： subMenuContent
搜 索： search
搜索關(guān)鍵字： keyword
搜索范圍： range
標(biāo)簽文字： tagTitle
標(biāo)簽內(nèi)容： tagContent
當(dāng)前標(biāo)簽： tagCurrent/currentTag
標(biāo) 題： title
列 表： list
當(dāng)前位置： currentPath
圖 標(biāo)： icon
注 釋： note
登 錄： login
注 冊(cè)： register
欄目： column
列 定 義： column_1of3 ( 三列中的第一列 </p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>50、)
column_2of3 ( 三列中的第二列 )
column_3of3 ( 三列中的第三列 )
2.2 直觀命名
當(dāng)在設(shè)計(jì) Web頁面以及需要對(duì)一個(gè) div 進(jìn)行標(biāo)識(shí)的時(shí)候，最自然的想法就是使用可以描述元素所在頁面位置的詞匯來對(duì)其命名。如：
自上而下分組： top-panel
橫向?qū)Ш剑?horizontal-nav
左面邊欄： left-side
中心 - 欄目： center-column
右面： right-col
2.3 CSS 復(fù)用
不需要重復(fù)定義可繼承的值，子元素自</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>51、動(dòng)繼承父元素的屬性值，象顏色、
字體等，已經(jīng)在父元素中定義過的， 在子元素中可以直接繼承， 不需要重復(fù)定義，除非是為了更變當(dāng)前元素樣式不使用父元素的屬性值， 但是要注意， 瀏覽器可能用一些默認(rèn)值覆蓋你的定義。
2.4. 多重 CSS樣式定義
CSS屬性追加重復(fù)最后優(yōu)先原則， 即一個(gè)標(biāo)簽可以同時(shí)定義多個(gè) class ，也可以是同一個(gè) class 中重復(fù)定義屬性。例如：
先定義兩個(gè)樣式
.one{width:200px;background:url() no-repeat left top;}
.two{border:</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>52、10px solid #000; background:url() no-repeat left top;}
在頁面代碼中，我們可以這樣調(diào)用 :
<div id="nkwkc2x" class=one two></div>
當(dāng)應(yīng)用兩個(gè)或多個(gè)樣式時(shí)，瀏覽器所應(yīng)用的樣式根據(jù)是屬性追加重復(fù)最后優(yōu)先原則。即兩個(gè)或多個(gè)或重復(fù)的樣式名定義， 瀏覽器所應(yīng)用的樣式是按先后順序的，如果定義了重復(fù)的屬性值， 以最后定義的為準(zhǔn)， 如果應(yīng)用了兩個(gè)或多個(gè)樣式名，里面不重復(fù)定義的屬性值就追加上去， 重復(fù)的屬性值就以最后一個(gè)為準(zhǔn)。這里要注意的是， 樣式的先后不是根據(jù)頁面上應(yīng)用的名字順序， 而是樣式表里的樣式順序。
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>53、
2.5.CSS 作用域
CSS的作用域是通過書寫方式來實(shí)現(xiàn)的更準(zhǔn)確的說法應(yīng)該叫做選擇器如
果你深入了解后， 同樣能達(dá)到編程思想中的 “命名空間” 、“全局”、“私有”、“繼承”等“編程特性”更能體現(xiàn)他特點(diǎn)的也就是他名字中的“層疊樣式”。
如下面的 p 的作用域：
/* 作用域：全局 */ p{text-indent:2em;}
/* 作用域： .demo 這個(gè)類中 */
.demo p{color:#000000;}
3. CSS 樣式書寫順序
3.1 顯示</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>54、屬性
* display * list -style * position * float * clear
3.2 自身屬性
* width * height * margin * padding * border * background
3.3 文本屬性
* color * font * text-decoration * text-align
* vertical-align * white-space * other text * content
4. 其它規(guī)范
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>55、
4.1 圖片樣式
禁止用 <img width=? height=?>
代碼中的 <img> 標(biāo)簽中不要帶上 width
圖片往往需要反復(fù)的修改。
來人為干預(yù)圖片顯示的尺寸，即在 HTML
和 height 兩個(gè)屬性，因?yàn)橹谱鬟^程中，
但是使用 CSS控制圖片大小時(shí)， 當(dāng)網(wǎng)頁還未加載圖片時(shí)， 不會(huì)留出圖片的占位大小，可能會(huì)造成網(wǎng)頁在加載過程中抖動(dòng) （如果圖片是插在一個(gè)固定大小的表格里的，不會(huì)有這個(gè)現(xiàn)象），尤其是當(dāng)圖片的尺寸較大時(shí)，這種現(xiàn)象會(huì)很明顯。
所以當(dāng)預(yù)料到這種會(huì)明顯導(dǎo)致網(wǎng)頁抖動(dòng)的情況會(huì)發(fā)生時(shí)，務(wù)必給 <im</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>56、g> 附上
width 和 height 屬性。
4.2 換行
為了最大程度的發(fā)揮瀏覽器自動(dòng)排版的功能， 在一段完整的文字中請(qǐng)盡量不要使用 <br> 來人工干預(yù)分段。
4.3 字體
所有的字號(hào)都應(yīng)該用樣式表來實(shí)現(xiàn)，禁止在頁面中出現(xiàn) <font size=?> 標(biāo)
記。
請(qǐng)不要在網(wǎng)頁中連續(xù)出現(xiàn)多于一個(gè)的也盡量少使用全角空格 （英文字符集下，
全角空格會(huì)變成亂碼），空白應(yīng)該盡量使用 text-indent, padding, margin, hspace, vspace 以及透明的 gif 圖片來實(shí)現(xiàn)。</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>57、
中英文混排時(shí)，我們盡可能的將英文和數(shù)字定義為 verdana 和 arial 兩種字體。
行 距 建 議 用 百 分 比 來 定 義 ， 常 用 的 兩 個(gè) 行 距 的 值 是 line-height:120%/150%.
第三部分 JavaScript 規(guī)范
1. 命名規(guī)范
1.1 基本原則
規(guī)范的命名能使程序更易閱讀， 從而更易于理解。 它們也可以提供一些標(biāo)識(shí)功能方面的信息，有助于更好的理解代碼和應(yīng)用。
? 使用可以準(zhǔn)確說明變量 / 函數(shù) / 原型 (pro</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>58、totype) 的完整英文描述符。
例如， firstName ，listAllUsers 或 CorporateCustomer 等，避免
使用漢語拼音、不相關(guān)單詞及漢字進(jìn)行命名。
? 采用大小寫混合，提高名字的可讀性。一般應(yīng)該采用小寫字母，但是原型 (prototype) 命名時(shí)任意單詞的首字母大寫。
? 盡量少用縮寫 ，但如果一定要使用，當(dāng)使用公共縮寫和習(xí)慣縮寫等，
如實(shí)現(xiàn)（ implement ）可縮寫成 impl ，經(jīng)理（ manager）可縮寫成 mgr
等，嚴(yán)禁濫用縮寫。
? 避免使用長名字（最好不超過 25 個(gè)字母）。
</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>59、
? 避免使用相似或者僅在大小寫上有區(qū)別的名字。
? 避免使用數(shù)字，但可用 2 代替 to ，用 4 代替 for 等，如：go2Jsp。此外，若元素 id 包含數(shù)字則除外
1.2 Prototype/Method 命名規(guī)范
1.2.1 原型 Prototype
所有單詞首字母大寫。使用能確切反應(yīng)該原型含義、功能等的詞。一般采用名詞。
1.2.2 方法 Method/ 函數(shù) Function
方法的命名應(yīng)采用完整的、能夠清楚表達(dá)該方法功能的英文描述符，首字母小寫，其他單詞的首字母大寫。 方法名稱的第一個(gè)單詞常常</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>60、采用一個(gè)有強(qiáng)烈動(dòng)
作色彩的 。
取 使用 get 前 ， 使用 set 前 ，判斷 使用 is(has) 前 。如
下例所示：
getName()
setSarry()
isLogon()
方法參數(shù)建 序： ( 被操作者，操作內(nèi)容，操作 志，其他?? ) 。如下
例所示：
function replace (sourceStr, // 源字串
oldStr, // 被替換字串
newStr){ // 替換為字串
}
1.3 字段命名規(guī)范
1.</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>61、3.1 常量
采用完整的英文大寫 ， 在 與 之 用下劃 接， 如：DEFAULT_VALUE
1.3.2 量
除第一個(gè) 外其余 首字母大寫。
私有 例 量可使用 _前 ，但在其存取方法中 將其前 去掉。
1.3.3 集合
一個(gè)集合，例如數(shù) 或 xml 點(diǎn)集合， 采用復(fù)數(shù)命名來表示 量中存放的是一 象。 命名 采用完整的英文描述符， 名字中所有非首 的第一個(gè)字母 大寫，適當(dāng)使用集合 寫前 。如下例所示：
集合 量命名示例
var rowNodes = xmlDom.sel</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>62、ectNodes(
“/*/data/row
”);
var aryUsers = []; //
用戶列表
1.3.4 特殊值
我們?cè)诔绦蚶锝?jīng)常會(huì)用到一些量，它是有特定的含義的。例如，現(xiàn)在我們
寫一個(gè)薪金統(tǒng)計(jì)程序， 公司員工有 50 人，我們?cè)诔绦蚶锞蜁?huì)用 50 這個(gè)數(shù)去進(jìn)行各種各樣的運(yùn)算。在這里， 50 就是“特殊值”。當(dāng)別的程序員在程序里看到 50 這個(gè)數(shù)，將很難知道它的含義，造成理解上的困難。
在程序里出現(xiàn)“特殊值”會(huì)降低程序的可讀性、可維護(hù)性和可擴(kuò)展性，故
規(guī)定不得出現(xiàn)此類“特殊值</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>63、” 。避免的方法是把“特殊值”定義為一個(gè)常量 。注意這個(gè)常量的命名應(yīng)該能表達(dá)該數(shù)的意義， 并且應(yīng)該全部大寫， 且單詞之間使用下劃線。例如上面 50 這個(gè)數(shù)，我們可以定義一個(gè)名為 NUM_OF_EMPLOYEES的常量。這樣，別的程序員在讀程序的時(shí)候就可以很容易的理解了。
1.4 異常
必要時(shí)，在 javascript 代碼段中加入異常捕獲代碼。 通常情況下不需要自
定義異常原型，僅使用內(nèi)建 error 對(duì)象。
異 常 原 型 由 表 示 該 異 常 類 型 的 單 詞 和 Exception 組 成 ， 如
ResponseExceptio</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>64、n 。
異常實(shí)例一般使用 e、ex 等，在多個(gè)異常時(shí)使用該異常名或簡寫加 E，Ex
等組成，例如： SQLEx、ActionEx 。
1.5 文件命名規(guī)范
外部 js 文件一律小寫命名。
1.6 命名約定表
操作項(xiàng)
命名約定
示例
參數(shù)
使用傳遞值 /對(duì)象的完整的英文描述符。
userID
字段 /屬性
字段采用完整的英文描述，第一個(gè)字母
firstName
小寫，任何中間單詞的首字母大寫。
布爾型的獲取成
所有的布爾型獲取函數(shù)必須用單詞
is isSt</p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>65、ring()
員函數(shù)
（ has）做前綴。
hasMoney()
采用完整的英文描述符，所有單詞的第
原型
一個(gè)字母大寫。
由表示該異常類型等的單詞和 Exception
異常原型名
組成
通常采用字母 e 、ex表示異常。
異常實(shí)例名 多個(gè)異常時(shí)使用異常名或其簡寫加 E、 Ex 等構(gòu)成
靜 態(tài) 常 量 字 段 全部采用大寫字母，單詞之間用下劃線
（常量） 分隔。采用靜態(tài)常量獲取成員函數(shù)。
采用完整的英文描述符，第一個(gè)字母小
寫，但不要隱藏已有字段。例如，如果
局部變量
有一個(gè)字段叫 firstName </p>
<p style='height:0px;padding:0;margin:0;overflow:hidden'>66、，不要讓一個(gè)局部變量叫 firstName 。
通常采用字母 i ， j ， k 或者 counter，
循環(huán)計(jì)數(shù)器
index
采用完整的英文描述說明成員函數(shù)功
能，第一個(gè)單詞盡可能采用一個(gè)生動(dòng)的
成員函數(shù)
動(dòng)詞，除第一個(gè)單詞外，每個(gè)單詞第一
個(gè)字母小寫。
獲取成員函數(shù) 被訪問字段名的前面加上前綴 get。
設(shè)置成員函數(shù) 被訪問字段名的前面加上前綴 set。
Customer
SQLException
ActionException
e
SQLEx
DEFAULT_NAME
,totalMoney
i,j,k,count,index
openFile()
addUser()
getUserName()
setUserName ()
2. 代碼組織與風(fēng)格
代碼組織和風(fēng)格的基本原則是：利于個(gè)人開發(fā)</p>
</div>
<div id="gl3zgwz" class="readmore" onclick="showmore()" style="background-color: transparent; height: auto; margin: 0px 0px; padding: 20px 0px 0px 0px;"><span id="jbkiysx" class="btn-readmore" style="background-color: transparent;"><em style="font-style: normal">展開</em>閱讀全文<i></i></span></div>
<script type="text/javascript">
function showmore()
{
$(".readmore").hide();
$(".detail-article").css({
"height":"auto",
"overflow": "hidden"
});
}
$(document).ready(function() {
var dh = $(".detail-article").height();
if(dh >100)
{
$(".detail-article").css({
"height":"100px",
"overflow": "hidden"
});
}
else
{
$(".readmore").hide();
}
});
</script>
</div>
<script type="text/javascript">
var defaultShowPage = parseInt("3");
var id = "25508059";
var total_page = "47";
var mfull = false;
var mshow = false;
function DownLoad() {
window.location.href='http://weibangfood.com.cn/d-25508059.html';
}
function relate() {
$("html,body").animate({ scrollTop: 0 }, 500);
$('#relate').toggle();
if (!mshow) {
var relateScroll = new iScroll("relatelist", { zoom: true, hScrollbar: false, vScrollbar: true, bounce: true, momentum: false });
}
}
</script>
<script> var pre = "https://file7.zhuangpeitu.com/fileroot7/2021-7/18/9f18480f-97c8-4086-bd72-040d5e3c5714/9f18480f-97c8-4086-bd72-040d5e3c5714";
var freepage = parseInt('20');
var total_c = parseInt('47');
var start = parseInt('3');
var adcount = 0;
var adindex = 0;
var adType_list = ";1;2;5;6;7;";
var end = start;
$("#spanpage").text(total_c-start);
function ShowSvg() {
end = start + defaultShowPage;
if (end > freepage) end = freepage;
for (var i = start; i < end; i++) {
var imgurl = pre + (i + 1) + '.gif';
var html = "<img src='" + imgurl + "' onerror=\"this.src='/images/s.gif'\" alt=\"WEB前端編碼規(guī)范_第" + (i + 1) + "頁\" width='100%'/>";
$("#page").append("<div id="r30nlbp" class='page'>" + html + "</div>");
$("#page").append("<div id="7pjovlq" class='pageSize'>第" + (i + 1) + "頁 / 共" + total_c + "頁</div>");
if(adcount > 0 && adType_list.indexOf(";"+(i+1)+";")>-1)
{
if(adindex > (adcount-1)) adindex = 0;
$("#page").append("<div id="tqxpdkp" class='pagead' id='addiv"+(i + 1)+"'></div>");
document.getElementById("addiv"+(i + 1)+"").innerHTML =document.getElementById("adpre" + adindex).outerHTML;
adindex += 1;
}
}
start = end;
$("#spanpage").text(total_c-start);
if (start > (freepage - 1)) {
if(start < total_c)
$("#ftip").html("親，很抱歉，此頁已超出免費(fèi)預(yù)覽范圍啦！<br/>如果喜歡就下載吧，價(jià)低環(huán)保！");
else
$("#ftip").html("最后一頁預(yù)覽完了！喜歡就下載吧，查找使用更方便");
if($("#nftip"))$("#nftip").html("此文檔不允許下載，在線閱讀到最后一頁了。");
$("#ntip2").hide();
$("#ntip").hide();
}
}
//$(document).ready(function () {
// ShowSvg();
//});
</script>
<div style="margin:10px 0px; text-align:center;">
<div style="margin: auto; height:300px; overflow:hidden; text-align: center;"><dl class="works-intro gray2 " style="text-align:left;border:solid 1px #ddd;">
<dd style="font-size:14px; padding-left:20px; width:96%; line-height:22px;"><b>溫馨提示: </b><br />
1: 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。<br>
2: 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。<br>
3.本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。<br>
4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。<br>
5. 裝配圖網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。<br>
6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。<br>
7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。<br>
</dd>
</dl></div> </div>
<div id="z70f2cw" class="widget-box pt0" style="border: none;">
<h2 class="h4 widget-box__title">最新文檔</h2>
<ul class="taglist--inline multi">
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483364.html" target="_blank">6.煤礦安全生產(chǎn)科普知識(shí)競(jìng)賽題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483363.html" target="_blank">2.煤礦爆破工技能鑒定試題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483362.html" target="_blank">3.爆破工培訓(xùn)考試試題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483361.html" target="_blank">2.煤礦安全監(jiān)察人員模擬考試題庫試卷含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483360.html" target="_blank">3.金屬非金屬礦山安全管理人員（地下礦山）安全生產(chǎn)模擬考試題庫試卷含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483359.html" target="_blank">4.煤礦特種作業(yè)人員井下電鉗工模擬考試題庫試卷含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483358.html" target="_blank">1 煤礦安全生產(chǎn)及管理知識(shí)測(cè)試題庫及答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483357.html" target="_blank">2 各種煤礦安全考試試題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483356.html" target="_blank">1 煤礦安全檢查考試題</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483355.html" target="_blank">1 井下放炮員練習(xí)題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483354.html" target="_blank">2煤礦安全監(jiān)測(cè)工種技術(shù)比武題庫含解析</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483353.html" target="_blank">1 礦山應(yīng)急救援安全知識(shí)競(jìng)賽試題</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483352.html" target="_blank">1 礦井泵工考試練習(xí)題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483351.html" target="_blank">2煤礦爆破工考試復(fù)習(xí)題含答案</a></li>
<li><a class="tag book" href="http://weibangfood.com.cn/article/253483350.html" target="_blank">1 各種煤礦安全考試試題含答案</a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="cbiejch" class="u-width265 u-floatRight js-sidebar" style="width:265px">
<div class="nbrlqm3" id="homeTab2" style="width:265px;margin-top:-12px;">
<div>
<a href="http://weibangfood.com.cn/d-25508059.html" class="download" style="background-position-x:50px; text-indent:10px;">點(diǎn)擊下載此資源</a>
</div>
<div id="7rhqijq" class="box hot-keywords mt20" style="overflow: hidden; width: 100%; border: solid 1px #dedede;"
id="relatebox">
<div id="r2knhbk" class="boxHd" style="padding-bottom: 0px;">
<h2 class="fl font-normal font16 font-yahei" style="font-size: 16px; font-weight: 100; margin-left: 0px; margin-top: 3px; position: relative; text-indent: 34px; font-family: 微軟雅黑">
<svg t="1586227845664" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="https://www.w3.org/2000/svg" p-id="6477" width="20" height="20"
style="position: absolute; left: 10px; top: -1px;">
<path d="M768.1 273.6c-52.9-98.8-155.5-162.1-264.6-162.1-129.8 0-245.2 83.6-285.2 204.9C96.9 350.6 6.9 472.7 6.9 606.4c0 162.9 131.8 300.5 287.8 300.5 12.7 0 23-10.3 23-23s-10.3-23-23-23C163.7 860.9 53 744.3 53 606.4 53 488.9 134 382.1 241.5 358l13.4-3 3.7-13.2c30.3-108.4 131-184.2 244.8-184.2 95.5 0 185.2 57.6 228.7 146.8l5.3 10.8 11.9 1.9C876.8 337 973 451.7 973 583.8c0 150.2-121.5 277.1-265.4 277.1-12.7 0-23 10.3-23 23s10.3 23 23 23c168.8 0 311.4-148 311.4-323.2C1019 433.3 911.9 302.1 768.1 273.6z" p-id="6478" fill="#bfbfbf"></path><path d="M325.9 683.8l172 198.6c4.8 5.6 11.8 8.7 19.1 8.7 7.3 0 14.3-3.2 19.1-8.7l172-198.6-38.3-33.2L540 800.7 540 465l-51 0 0 330.2L364 650.6 325.9 683.8z" p-id="6479" fill="#bfbfbf"></path>
</svg>
相關(guān)資源</h2><a style="display:block; position:absolute;right:10px; top:2px; color:#888;font-size:13px;" target="_blank"
rel="nofollow" href="http://weibangfood.com.cn/search.html?q=WEB%e5%89%8d%e7%ab%af%e7%bc%96%e7%a0%81%e8%a7%84%e8%8c%83" >更多</a>
</div>
<div class="f257kgy" id="author-works-list" class="author-works-list bgF">
<div class="jvnoiws" id="xgwendang" style=" line-height:30px; text-align:center;height:460px;border-radius:3px;" >
<div style="padding-top:140px; ">
<div>正為您匹配相似的精品文檔</div>
<div><img src="/images/jdt.gif" style=" width:220px; margin: 10px 0px" /></div>
</div>
<script type="text/javascript">
function xg() {
var myiframe = '<iframe scrolling="no" src="https://smart.zhuangpeitu.com/ajax.aspx?type=pc&q=WEB%e5%89%8d%e7%ab%af%e7%bc%96%e7%a0%81%e8%a7%84%e8%8c%83&id=25508059&sign=e942f5db5591aba83e1ace8fbad343b5" style="width:100%; height:460px;;" frameborder="0" enableviewstate="false" ></iframe>';
document.getElementById("xgwendang").innerHTML = myiframe;
}
setTimeout('xg()', 500)
</script>
</div>
</div>
</div>
</div><div id="lzcwdka" class="box hot-keywords mt10" id="box3" style="overflow: hidden;width: 100%; border:solid 1px #dedede;">
<div id="urnhb8x" class="boxHd" style="border: none;padding-bottom: 0px;">
<h2 class="fl font-normal font16 font-yahei" style="font-size: 16px; font-weight: 100;position:relative; text-indent:34px;
margin-left: 0px; margin-top: 3px; font-family: 微軟雅黑">
<svg t="1586228055974" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="https://www.w3.org/2000/svg" p-id="7665"
width="20" height="20" style="position:absolute;left:10px; top:0px;"><path d="M870 154c-13.1-13.1-30.4-21.8-49.8-24L527.8 97.5c-25.2-2.8-50.3 6-68.3 24l-326 326c-48.7 48.7-48.7 128.5 0 177.2l265.8 265.8c48.7 48.7 128.5 48.7 177.2 0l326-326c17.9-17.9 26.8-43.1 24-68.3L894 203.8c-2.2-19.4-10.9-36.8-24-49.8z m3.2 381.1l-326 326c-15.7 15.7-36.8 24.4-59.3 24.4s-43.5-8.7-59.3-24.4L162.9 595.3c-15.7-15.7-24.4-36.8-24.4-59.3s8.7-43.5 24.4-59.2l326-326c7.9-7.9 18.5-12.3 29.7-12.3 1.5 0 3.1 0.1 4.6 0.3l292.4 32.5c9.6 1.1 18.2 5.2 25 12 6.8 6.8 11 15.5 12.1 25.1l32.5 292.3c1.5 12.8-2.9 25.3-12 34.4z" p-id="7666" fill="#bfbfbf"></path><path d="M723.3 217.7c-45.8 0-83 37.2-83 83s37.2 83 83 83 83-37.2 83-83c0-45.9-37.1-83-83-83z m0 124.5c-22.9 0-41.5-18.6-41.5-41.5s18.6-41.5 41.5-41.5 41.5 18.6 41.5 41.5-18.6 41.5-41.5 41.5z" p-id="7667" fill="#bfbfbf"></path></svg>
相關(guān)搜索</h2>
</div>
<input name="ctl00$Content$hiddenCategoryID" type="hidden" id="Content_hiddenCategoryID" />
<div id="torsbpf" class="hot-keywords-list" style="padding:10px 20px;">
<a target="_blank" rel="nofollow" href="http://weibangfood.com.cn/search.html?q=WEB"
class="tag-item ico" title="WEB" hidefocus="true"><span id="g2orhqk" class="ico"><em>
WEB</em></span></a>
<a target="_blank" rel="nofollow" href="http://weibangfood.com.cn/search.html?q=%e5%89%8d%e7%ab%af"
class="tag-item ico" title="前端" hidefocus="true"><span id="7mivasz" class="ico"><em>
前端</em></span></a>
<a target="_blank" rel="nofollow" href="http://weibangfood.com.cn/search.html?q=%e7%bc%96%e7%a0%81"
class="tag-item ico" title="編碼" hidefocus="true"><span id="y75awq8" class="ico"><em>
編碼</em></span></a>
<a target="_blank" rel="nofollow" href="http://weibangfood.com.cn/search.html?q=%e8%a7%84%e8%8c%83"
class="tag-item ico" title="規(guī)范" hidefocus="true"><span id="zf2xcwv" class="ico"><em>
規(guī)范</em></span></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://weibangfood.com.cn/js/artDialog-5.0.3/artDialog.min.js"></script>
<script>
var uid = "0";
var obj = null;
function popFolder() {
var html = '<iframe src="/FlexPaper/BookFolderSelect.aspx?id=25508059" scrolling="no" frameborder="0" style="width: 550px; height: 300px"></iframe>';
if (uid == "0") { window.location.href="http://weibangfood.com.cn/login.aspx?returl=http%3a%2f%2fweibangfood.com.cn%2fView_renren.aspx%3fid%3d25508059"; return; }
obj = art.dialog({ title: '收藏資源', content: html, cancelValue: '取消',
width: '540', height: '380', skin: 'blue', lock: true,
background: '#666', opacity: .6, duration: 300, fixed: true, left: '50%',
top: '38.2%', zIndex: 1987, resize: true, drag: true
});
}
function CloseMe() {
obj.close();
}
var tp2 = $('#homeTab2').offset().top;
$(window).bind("scroll", function (event) {
var Y = $(this).scrollTop();
if (Y > tp2 && $('#homeTab2').css("position") != "fixed") {
$('#homeTab2').css({
position: "fixed",
width: "265px",
top: "15px",
zIndex: "999"
});
} else if (Y <= tp2 && $('#homeTab2').css("position") == "fixed") {
$('#homeTab2').css({
position: "static",
zIndex: "1"
});
}
});
</script>
</div>
<div id="qhbiesm" class="cssnone">
<iframe src="http://weibangfood.com.cn/BookRead.aspx?id=dTvTrwwyNpjv0EWxTC0wPQ%3d%3d&to=A7iMrMZZiDLX36fgPzlv8QibBE%2f8aLk0Y2d7C7cuJaJvUSUuslMVKo79Zc2OtYXTWf6DXutJGvuMaaifgszScFAIqLvLWOSSNZpal%2bANSiwSD%2b3E%2bLbSQu6vnmbZ3NTjaGdIFvUn9HyV34Eo2i3tERM8f1k24PqckTyMXdElrBJd7uHGO6qhmvFNymAIlKqutA724PFKp5aI5l1yzieuEw%3d%3d" frameborder="0" style="width: 0px; height: 0px">
</iframe>
</div>
<!-- JiaThis Button END -->
<span id="LabelScript"></span>
</div>
</div>
<script>function popLogin() {
window.location.href = '/login.aspx?returl=http%3a%2f%2fweibangfood.com.cn%2fView_renren.aspx%3fid%3d25508059'; return;
}</script>
<script type="text/javascript">
var objjubao = null;
function jubao() {
var html = '<iframe src="http://weibangfood.com.cn/UserManage/ReportBack.aspx?id=25508059&url=vZ7Tt5whIvr/dRdNgGIKyPKNDzA93OKs oH1UA29j7gQz3uKhWEeAHHbezUmCzOpfr4eV4Ghp8M=" scrolling="no" frameborder="0" style="width: 600px; height: 420px"></iframe>';
objjubao = art.dialog({
title: '非法內(nèi)容有獎(jiǎng)舉報(bào)', content: html,
close: Closejubao, width: '700', height: '470', skin: 'blue', lock: true,
background: '#666', opacity: .6, duration: 300, fixed: true, left: '50%',
top: '38.2%', zIndex: 1987, resize: true, drag: true
});
}
function Closejubao() {
objjubao.close();
}
</script>
<!--foot-->
<div id="r70727c" class="bg_100 foot_nav_bg" style=" min-width:1200px;">
<div id="2nb30g2" class="foot_nav">
<a href="http://weibangfood.com.cn/h-33.html" target="_blank" >關(guān)于我們</a> - <a href="http://weibangfood.com.cn/h-34.html"
target="_blank" >網(wǎng)站聲明</a> - <a href="http://weibangfood.com.cn/h-35.html" target="_blank" >
網(wǎng)站地圖</a> - <a href="http://weibangfood.com.cn/sitemap.html" target="_blank" >
資源地圖</a>
- <a href="http://weibangfood.com.cn/friend.aspx" target="_blank" >友情鏈接</a> -
<a rel="nofollow" target="_blank" >網(wǎng)站客服</a>
- <a rel="nofollow" href="http://weibangfood.com.cn/h-38.html" target="_blank" >聯(lián)系我們</a>
</div>
</div>
<div id="eajoipu" class="bg_100 siteInner_bg" style=" min-width:1200px;">
<div id="y2krldf" class="siteInner">
<p>copyright@ 2023-2025 zhuangpeitu.com 裝配圖網(wǎng)版權(quán)所有 聯(lián)系電話：18123376007</p><p><a target="_blank"><span><span>備案號(hào):</span></span><span>蜀</span><span>ICP</span><span>備</span><span>2024067431</span><span>號(hào)</span><span>-1</span></a> <span>川公網(wǎng)安備51140202000466號(hào)</span></p><p><span><span><br /></span></span></p><p><span><span>本站為文檔C2C交易模式，即用戶上傳的文檔直接被用戶下載，本站只是中間服務(wù)平臺(tái)，本站所有文檔下載所得的收益歸上傳人(含作者)所有。裝配圖網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)上載內(nèi)容本身不做任何修改或編輯。若文檔所含內(nèi)容侵犯了您的版權(quán)或隱私，請(qǐng)立即通知<span>裝配圖</span>網(wǎng)，我們立即給予刪除！</span></span></p>
</div>
</div>
<!--foot end-->
<script type="text/javascript" src="http://weibangfood.com.cn/JS/jquery.lazyload.js"></script>
<script type="text/javascript" charset="utf-8">
$("img.lazys").lazyload({
threshold: 200,
effect: "fadeIn"
});
</script>
<script type="text/javascript" src="http://weibangfood.com.cn/umeditor/xss.js"></script>
<script>(function() {var _53code = document.createElement("script");_53code.src = "https://tb.53kf.com/code/code/f0b69d13c371916b96c564bba41b9dae8/1";var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(_53code, s);})();</script><script>var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://#/hm.js?f6f8927201e0ce73292b83a428843c78";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();</script>
<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<a href="http://weibangfood.com.cn/" title="九色91精品国产网站">九色91精品国产网站</a>
<div class="friend-links">
</div>
</div>
</footer>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="nblvd" class="pl_css_ganrao" style="display: none;"><ul id="nblvd"><rp id="nblvd"><abbr id="nblvd"></abbr></rp></ul><tfoot id="nblvd"></tfoot><output id="nblvd"><small id="nblvd"><table id="nblvd"></table></small></output><option id="nblvd"></option><form id="nblvd"></form><abbr id="nblvd"></abbr><progress id="nblvd"><address id="nblvd"></address></progress><tbody id="nblvd"><blockquote id="nblvd"><button id="nblvd"></button></blockquote></tbody><video id="nblvd"><dfn id="nblvd"></dfn></video><font id="nblvd"><ruby id="nblvd"><li id="nblvd"></li></ruby></font><nav id="nblvd"><dl id="nblvd"><wbr id="nblvd"></wbr></dl></nav><sub id="nblvd"><ruby id="nblvd"><b id="nblvd"></b></ruby></sub><optgroup id="nblvd"><listing id="nblvd"></listing></optgroup><progress id="nblvd"><delect id="nblvd"><button id="nblvd"></button></delect></progress><span id="nblvd"></span><dfn id="nblvd"><ul id="nblvd"><em id="nblvd"></em></ul></dfn><dl id="nblvd"><dd id="nblvd"><sup id="nblvd"></sup></dd></dl><pre id="nblvd"><progress id="nblvd"></progress></pre><big id="nblvd"><tr id="nblvd"><xmp id="nblvd"></xmp></tr></big><delect id="nblvd"></delect><address id="nblvd"></address><legend id="nblvd"></legend><legend id="nblvd"></legend><acronym id="nblvd"></acronym><dl id="nblvd"></dl><sub id="nblvd"><center id="nblvd"><tr id="nblvd"><abbr id="nblvd"></abbr></tr></center></sub><nav id="nblvd"><sup id="nblvd"><rt id="nblvd"><acronym id="nblvd"></acronym></rt></sup></nav><i id="nblvd"><source id="nblvd"><tr id="nblvd"><sub id="nblvd"></sub></tr></source></i><mark id="nblvd"></mark><address id="nblvd"><big id="nblvd"></big></address><progress id="nblvd"></progress><ul id="nblvd"><abbr id="nblvd"></abbr></ul><nav id="nblvd"></nav><legend id="nblvd"><center id="nblvd"><tbody id="nblvd"><address id="nblvd"></address></tbody></center></legend><tr id="nblvd"><optgroup id="nblvd"><var id="nblvd"><strike id="nblvd"></strike></var></optgroup></tr><var id="nblvd"><style id="nblvd"></style></var><ul id="nblvd"><em id="nblvd"><listing id="nblvd"></listing></em></ul><em id="nblvd"></em><thead id="nblvd"></thead><pre id="nblvd"></pre><button id="nblvd"></button><output id="nblvd"><button id="nblvd"></button></output><xmp id="nblvd"></xmp><optgroup id="nblvd"><cite id="nblvd"></cite></optgroup><abbr id="nblvd"></abbr><tr id="nblvd"></tr><small id="nblvd"><style id="nblvd"></style></small><menuitem id="nblvd"><delect id="nblvd"><output id="nblvd"><u id="nblvd"></u></output></delect></menuitem><noscript id="nblvd"><strong id="nblvd"><sup id="nblvd"><div id="nblvd"></div></sup></strong></noscript><rp id="nblvd"></rp></div>
</html>
《WEB前端編碼規(guī)范》由會(huì)員分享，可在線閱讀，更多相關(guān)《WEB前端編碼規(guī)范（47頁珍藏版）》請(qǐng)?jiān)谘b配圖網(wǎng)上搜索。
1、 XXXX有限公司 XXXXXXXX管理平臺(tái) Web 前端代碼編寫規(guī)范 文件狀態(tài)： 文件標(biāo)識(shí)： [ √ ] 草稿 當(dāng)前版本： 1.0 [ ] 正式發(fā)布 作 者： 李光強(qiáng) [ ] 正在修改 完成日期： 2016.1.30 XXXXXX 2016 年 1
2、 月 修改歷史 修訂后 修訂人 修訂 編號(hào) 修訂內(nèi)容簡述 版本號(hào) 日期 11.0 李光強(qiáng) 起草 2016.1.30 第一部分 HTML 規(guī)范 HTML并不是一種編程語言，而是一種標(biāo)記語言，它沒有任何真正的編程語 言中的循環(huán)或是流程控制語句。然而， HTML代碼的格式和風(fēng)格是非常重要的，因?yàn)橐?jīng)常對(duì) HTML代碼進(jìn)行維護(hù)和修改， 因此 HTML代碼必須有很清晰的邏輯結(jié)構(gòu)和布局，而使其易懂和易于維護(hù)。 HTML語言是不區(qū)分大小寫的，但為改善
3、可讀性，規(guī)定小寫所有字母（除最 上一行引用外） 。與 HTML不一樣， XHTML對(duì)大小寫是敏感的，