亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

團(tuán)隊合作前端書寫習(xí)慣總結(jié)

番茄西紅柿 / 1080人閱讀

摘要:函數(shù)的名字前綴為動詞,以此區(qū)分變量和函數(shù)示例函數(shù)命名命名方法小駝峰式命名法命名規(guī)范前綴應(yīng)當(dāng)為動詞命名建議可使用常見動詞約定動詞含義返回值判斷是否可執(zhí)行某個動作權(quán)限函數(shù)返回一個布爾值。含有此值不含有此值判斷是否為某個值函數(shù)返回一個布爾值。

CSS 規(guī)范

CSS 書寫規(guī)范

  • class類: 小寫字母,-分割;
  • 圖片: 小寫字母,‘-’或者‘_’ 分割;
  • 避免選擇器嵌套層級過多,少于3級;
  • 不要隨意使用id,id應(yīng)該按需使用,而不能濫用;
  • 使用CSS縮寫屬性 ,比如padding:0 10px 5px 5px等等,這樣精簡代碼同時又能提高用戶的閱讀體驗;
  • 不縮寫單詞,除非一看就明白的單詞

CSS 字體單位

  • px像素(Pixel),相對長度單位,像素px是相對于顯示器屏幕分辨率而言的。
  • em是相對長度單位。相對于當(dāng)前對象內(nèi)文本的字體尺寸。如當(dāng)前對行內(nèi)文本的字體尺寸未被人為設(shè)置,則相對于瀏覽器的默認(rèn)字體尺寸。
  • rem也是相對長度單位,但相對的只是HTML根元素。
  • vw代表視窗(Viewport)的寬度為1%,如果視窗寬度為1000px,那么50vw = 500px。
  • vh代表窗口高度的百分,如果視窗高度為800px,那么50vh = 400px

CSS 注釋格式

  • 用來區(qū)分頁面的注釋:如“/************************產(chǎn)品中心*******************************/”
  • 模塊的注釋,如/*首頁導(dǎo)航欄/ */

常用CSS命名規(guī)則

id的命名

(1)頁面結(jié)構(gòu)

  • 容器: container
  • 頁頭:header
  • 內(nèi)容:content/container
  • 頁面主體:main
  • 頁尾:footer
  • 導(dǎo)航:nav
  • 側(cè)欄:sidebar
  • 欄目:column
  • 頁面外圍控制整體布局寬度:wrapper
  • 左右中:left right center

(2)導(dǎo)航

  • 導(dǎo)航:nav
  • 主導(dǎo)航:mainnav
  • 子導(dǎo)航:subnav
  • 頂導(dǎo)航:topnav
  • 邊導(dǎo)航:sidebar
  • 左導(dǎo)航:leftsidebar
  • 右導(dǎo)航:rightsidebar
  • 菜單:menu
  • 子菜單:submenu
  • 標(biāo)題: title
  • 摘要: summary

(3)功能

  • 標(biāo)志:logo
  • 廣告:banner
  • 登陸:login
  • 登錄條:loginbar
  • 注冊:regsiter
  • 搜索:search
  • 功能區(qū):shop
  • 標(biāo)題:title
  • 加入:joinus
  • 狀態(tài):status
  • 按鈕:btn
  • 滾動:scroll
  • 標(biāo)簽頁:tab
  • 文章列表:list
  • 提示信息:msg
  • 當(dāng)前的: current
  • 小技巧:tips
  • 圖標(biāo): icon
  • 注釋:note
  • 指南:guide
  • 服務(wù):service
  • 熱點:hot
  • 新聞:news
  • 下載:download
  • 投票:vote
  • 合作伙伴:partner
  • 友情鏈接:link
  • 版權(quán):copyright

Class命名

(1)顏色:使用顏色的名稱或者16進(jìn)制代碼

  • .red { color: red; }
  • .f60 { color: #f60; }

(2)字體大小,直接使用”font+字體大小”作為名稱

  • .font-12px { font-size: 12px; }
  • .font-9pt {font-size: 9pt; }

(3)對齊樣式,使用對齊目標(biāo)的英文名稱,如

  • .left { float:left; }
  • .bottom { float:bottom; }

(4)標(biāo)題欄樣式,使用”類別+功能”的方式命名,如

  • .bar-news { }
  • .bar-product { }

 

JS規(guī)范

JS命名規(guī)范

JS 變量命名

命名方法:小駝峰式命名

命名規(guī)范:前綴應(yīng)當(dāng)是名詞。(函數(shù)的名字前綴為動詞,以此區(qū)分變量和函數(shù))

示例

var maxCount = 10;
var tableTitle = LoginTable;

 

JS 函數(shù)命名

命名方法:小駝峰式命名法

命名規(guī)范:前綴應(yīng)當(dāng)為動詞

命名建議:可使用常見動詞約定

動詞 含義 返回值
can 判斷是否可執(zhí)行某個動作(權(quán)限) 函數(shù)返回一個布爾值。true:可執(zhí)行;false:不可執(zhí)行
has 判斷是否含有某個值 函數(shù)返回一個布爾值。true:含有此值;false:不含有此值
is 判斷是否為某個值 函數(shù)返回一個布爾值。true:為某個值;false:不為某個值
get 獲取某個值 函數(shù)返回一個非布爾值
set 設(shè)置某個值 無返回值、返回是否設(shè)置成功或者返回鏈?zhǔn)綄ο?/td>
load 加載某些數(shù)據(jù) 無返回值或者返回是否加載完成的結(jié)果

 JS 常量命名

命名方法:名稱全部大寫

命名規(guī)范:使用大寫字母和下劃線來組合命名,下劃線用以分割單詞

示例

var MAX_COUNT = 10;
var URL = http://www.runoob.com;

 

 JS 文件命名

使用短線(-)或句點(.)作為分隔符號,推薦使用句點,最好使用小寫英文字符,不要使用其他符號和擴(kuò)展字符,如 jQuery UI 1.9.0 的源文件可命名為"jquery-ui-1.9.0.js"

使用 .js 擴(kuò)展名,這個擴(kuò)展名的兼容性最好。其實任何擴(kuò)展名都可以,只要是 text 類型、編碼正確即可

用句點分隔表示名稱中的從屬關(guān)系,范圍大的在前,如jQuery 的表單插件 Form既可以命名為jquery.form.js

JS注釋格式

使用多行注釋,以/*開頭,*/結(jié)尾

JS 注意事項

書寫格式

  • JS 換行縮進(jìn):采用tab(打散為4個空格)
  • 結(jié)束行需添加分號`;`


 

HTML 規(guī)范

1. 盡量減少標(biāo)簽層級;

2. 雙標(biāo)簽必須閉合,單標(biāo)簽用斜線閉合;

3. HTML第一行統(tǒng)一使用HTML5標(biāo)準(zhǔn);

4.注意代碼加注釋,增加可讀性,如:


content

5. 代碼縮進(jìn)統(tǒng)一用4 空格;

 

參考:http://www.runoob.com/w3cnote/front-end-standards.html

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

轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/1666.html

相關(guān)文章

  • 一個靠譜的前端開源項目需要什么?

    摘要:一個靠譜的應(yīng)該包含以下幾部分言簡意賅的項目介紹你的項目解決了什么核心問題,有哪些令人心動的特性。除了在中提到遵循的開源協(xié)議外,一個靠譜的開源項目還會將該開源協(xié)議的內(nèi)容文檔放在自己的項目下方。 0. 前言 寫前端代碼一段時間之后,你可能會萌生做一個開源項目的想法,一方面將自己的好點子分享出去讓更多的人受益,另一方面也可以在社區(qū)貢獻(xiàn)的環(huán)境下學(xué)到更多的東西從而快速成長。但是開源項目也有開源項...

    hiyayiji 評論0 收藏0
  • 一個靠譜的前端開源項目需要什么?

    摘要:一個靠譜的應(yīng)該包含以下幾部分言簡意賅的項目介紹你的項目解決了什么核心問題,有哪些令人心動的特性。除了在中提到遵循的開源協(xié)議外,一個靠譜的開源項目還會將該開源協(xié)議的內(nèi)容文檔放在自己的項目下方。 0. 前言 寫前端代碼一段時間之后,你可能會萌生做一個開源項目的想法,一方面將自己的好點子分享出去讓更多的人受益,另一方面也可以在社區(qū)貢獻(xiàn)的環(huán)境下學(xué)到更多的東西從而快速成長。但是開源項目也有開源項...

    DesGemini 評論0 收藏0
  • # 前端進(jìn)階--1.為什么要制定開發(fā)規(guī)范?

    摘要:使用代替可以使用工具代替結(jié)語我們應(yīng)該根據(jù)公司情況業(yè)務(wù)場景和團(tuán)隊具體情況來制定適合自己的開發(fā)規(guī)范,開發(fā)規(guī)范不需要最好,也沒有最好的開發(fā)規(guī)范,只有適合自己的。后期我將和大家分享如何制定開發(fā)規(guī)范。 0 為什么要有規(guī)范? 與性能無關(guān) 與功能無關(guān) 與效果無關(guān) 與能力無關(guān) 與工期無關(guān) 但是,規(guī)范必不可少 與效率相關(guān)(開發(fā)、迭代和維護(hù),重點提升維護(hù)及迭代效率) 與團(tuán)隊相關(guān)(減少團(tuán)隊之間的不一致...

    TerryCai 評論0 收藏0
  • [前端開發(fā)]--分享個人習(xí)慣的命名方式

    摘要:最近在知乎上看到這個作為程序員,有沒有讓你感到既無語又崩潰的程序命名。今天,也分享下最近自己在使用的命名習(xí)慣,當(dāng)然只是個人習(xí)慣。但是兩個函數(shù)的命名,一個是,另一個是。關(guān)于的命名規(guī)范,應(yīng)該很多人都是習(xí)慣用大駝峰命名。 把一件平凡的事情做好,很平凡。把一件平凡的事情堅持的做好,很不平凡。 1.前言 如果說計算機(jī)科學(xué)只存在兩個難題:緩存失效和命名。那么我就覺得命名的難點只有兩個:詞匯量和堅持...

    Rocture 評論0 收藏0

發(fā)表評論

0條評論

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