常用的檔案命名:
較長檔名必須以-
中橫槓符連線,專案裡面的私有樣式檔案:專案名-業務模組名稱.css。
例:
/* 專案名為clout */
/* good */
clout-home.css
/* bad */
clouthome.css;
(重要)在不是必須的情況下盡可能不用id選擇器。例:
/* 選擇器名稱 */
/* good */
.mydialog
/* bad */
.mydialog
/* 模組及巢狀 */
/* good */
標題.mydialog-hd-title
/* bad */
標題.mydialog .hd .title
(建議)常用的選擇器命名:
(重要)統一使用4
個空格縮排,不得使用tab
和2
個空格(沒規範前的縮排方式不管)。
(重要)選擇器跟
/* bad */
.selector(重要)屬性跟:
之間不能有空格,:
跟屬性值之間必須包含空格。
例:
/* good */
.selector
/* bad */
.selector
(重要)>
、+
、~
選擇器的兩邊各保留乙個空格。
例:
/* good */
.header > .title
label + input
input:checked ~ .input-face
/* bad */
.header>.title
......
(重要)乙個rule中有多個選擇器時,選擇器間必須換行。
例:
/* good */
p,div,
input,
textarea
/* bad */
p, div, input, textarea
(重要)屬性值之間必須換行。
例:
/* good */
.content
/* bad */
.content
(建議)對於超長的樣式屬性值,可在空格
或,
處換行。
例:
.selector
.selector
(重要)每行不得超過 120 個字元,除非單行不可分割(例如url超長)。
(重要)文字內容必須用雙引號包圍。
例:
/* good */
body
/* bad */
body
(重要)數值為 0 - 1 之間的小數,省略整數部分的 0 。
例:
/* good */
body
/* bad */
(重要)數值為0
的屬性值須省略單位。
例:
/* good */
body
/* bad */
body
(重要)url()
函式中的路徑不加引號
例:
/* good */
body
/* bad */
body
(建議)url()
函式中的絕對路徑可省去協議名
例:
/* good */
body
/* bad */
body
(重要)rgb顏色值必須使用十六進製制形式#3f3f3f
。不允許使用rgb()
。
解釋:帶有alpha(不透明度)的顏色資訊可以使用rgba()
。使用rgba()
時每個逗號後須保留乙個空格。
例:
/* good */
.border
.overlayer
/* bad */
.border
.overlayer
(重要)顏色值可縮寫時,須使用縮寫形式。
例:
/* good */
.text-grey
/* bad */
.text-grey
(重要)顏色值不可使用顏色單詞。
例:
/* good */
.text-red
/* bad */
.text-red
(建議)顏色值中的英文本母使用小寫,如果採用大寫字母,則必須保證同一專案內是一致的。
例:
/* good */
.border-color
/* bad */
.border-color
(重要)dom節點id
、class
屬性賦值時=
之間不得有空格,屬性值必須用雙引號包圍,不得用單引號。
例:
/* good */
/* bad */
(重要)如無必要,盡量不使用id
選擇器,給id
、class
選擇器設定屬性時不需要新增型別選擇器進行限定。
例:
/* good */
#footer,
.container
/* bad */
div#footer,
div.container
(重要)id
選擇器不需巢狀其他選擇器。
例:
提示語
/* good */
#tips
/* bad */
.footer #tips
(建議)在可以使用縮寫的情況下,盡量使用屬性縮寫。
例:
/* good */
body
/* bad */
body
(建議)使用border
、margin
、padding
等縮寫時,應注意確實需要設定多個方向的值時才使用縮寫,避免其他方向的有用值被覆蓋掉
例:
.wrap
/* good */
.list-wrap
/* bad */
.list-wrap
(建議)按如下順序書寫,摘自
位置屬性(position, top, right, z-index,display, float, overflow 等)例:大小(width, height, padding, margin, border)
文字系列(font, line-height, letter-spacing,color- text-align等)
視覺(background, color, list-style等)
其他(animation, transition等)
.footer-fixed
(重要)使用transition
時應指定transiton-property
,不用all
。
例:
/* good */
.tab
/* bad */
.tab
(建議)屬性的私有字首按長到短排列,按:
對其
例:
/* good */
.tab
/* bad */
.tab
php 編碼規範哪些 php編碼規範
1.php 必須以完整的形式來定界 即不要使用php 短標籤 且保證在關閉標籤後不要有任何空格。2.當乙個字串是純文字組成的時候 即不含有變數 則必須總是以單引號 作為定界符。例如 a example string 3.變數替換中的變數只允許用 變數名 的形式。例如 greeting hello n...
php 編碼規範哪些 PHP編碼規範
很多初學者對編碼規範不以為然,認為對程式開發沒有什麼幫助,甚至因為要遵循規範而影響了學習和開發的進度。或者因為經過一段時間的使用,已經形成了自己的一套風格,所以不願意去改變。這種想法是很危險的。如今的 web 開發,不再是乙個人就可以全部完成的,尤其是一些大型的專案,往往需要十幾人,甚至幾十人來共同...
php 編碼規範哪些 PHP 編碼規範
這是給小組制定的php編碼規範 該 php 編碼規範基本上是同 psr 規範的。有一部分的編碼規範 psr 中是建議,此編碼規範會強制要求。此編碼規範 是以 psr 1 psr 2 psr 2擴充套件 為藍本,並增加了相應的細節說明。通則基本編碼 php 必須使用 長標籤 或 短輸出標籤 一定不可使...