前端小知識點 class命名規範

2022-09-14 09:15:11 字數 1154 閱讀 3975

一、命名規則說明:

1、所有的命名最好都小寫

2、屬性的值一定要用雙引號("")括起來,且一定要有值如class="divcss5",id="divcss5"

3、每個標籤都要有開始和結束,且要有正確的層次,排版有規律工整

4、空元素要有結束的tag或於開始的tag後加上"/"

5、表現與結構完全分離,**中不涉及任何的表現元素,如style、font、bgcolor、border等

6、的定義,應遵循從大到小的原則,體現文件的結構,並有利於搜尋引擎的查詢

7、給每乙個**和表單加上乙個唯一的、結構標記id

8、給加上alt標籤

9、盡量使用英文命名原則

10、盡量不縮寫,除非一看就明白的單詞

11、類名的第乙個字元不能使用數字!它無法在 mozilla 或 firefox 中起作用

二、相對網頁外層重要部分css樣式命名:

外套 wrap ------------------用於最外層

頭部 header ----------------用於頭部

主要內容 main ------------用於主體內容(中部)

左側 main-left -------------左側布局

右側 main-right -----------右側布局

導航條 n** -----------------網頁選單導航條

內容 content ---------------用於網頁中部主體

底部 footer -----------------用於底部

讓我們來看下這個類名定義:

.right-red

你可能很明確的知道這個class選擇符的所起的作用。但是這裡還有個問題,當你在一星期的時間需要重新設計。在重新設計的時候,這個模組被放置到了左邊,而且還是綠色。這個類就不再有存在的價值。所以現在不得不選擇,要麼改變所有的屬性值,要麼放著它不動,這可能導致混亂。

最好不要在你的類名或者id名中去加入顏色或者長寬的尺寸等帶有屬性的名字。你應該避免任何的屬性值都是直接的詞彙。(如box)直接屬性可能會導致內容的分離。

讓我們來看看最合理id/class的命名規範:

.product-description

用這種樣式定義的product-description(產品描述),不管你怎麼改變,她都是那麼的乾淨清晰。

前端小知識點

1 自呼叫方法 function jquery 這裡把jquery傳遞給 其實是方便你使用 符號而不是jquery關鍵字 2 閉包 函式用到外部變數,不需要傳參就可以獲取 3 extend jquery.extend 函式用於將乙個或者多個物件的內容合併到目標物件。extend dest,src1,...

前端小知識點

列表項前面標註 span值個數分別為1個 2個 3個 4個 1 margin 上 右 下 左 2 margin 上 下 左 右 3 margin 上 左 右 下 4 margin 上 右 下 左 順時針 html特殊字元編碼對照表 賬號前後不能含空格 let spacereg s s 賬號名稱不能含...

python 命名規範知識點彙總

1,模組命名 1 模組推薦使用小寫命名,2 除非有很多字母,盡量不要用下劃線 因為很多模組檔案存與模組名稱一致的類,模組採用小寫,類採用首字母大寫,這樣就能區分開模組和類。2,類命名 1 類名使用駝峰 camelcase 命名風格,首字母大寫 2 私有類可用乙個下劃線開頭。3,函式命名 1 函式名一...