Css編碼

如何提高編碼的規(guī)范性

Css基礎選擇器
  • ID選擇器 #title
  • 類選擇器 .title{ }
  • 屬性選擇器 a[ href = " " ]
  • 偽劣和偽對象選擇器 :hover ::after
  • 標簽選擇器 a{}
  • 通配符選擇器 body *{ }
選擇器組合方式
  • 后代選擇符 .reader .title{}
  • 子選擇符 .reader >.title{}
  • 相鄰選擇符 .reader+.title{}

Css權重計算規(guī)則??

  • 計算ID選擇器的數(shù)量
  • 計算選擇器中類選擇器、屬性選擇器和偽類選擇器的數(shù)量
  • 計算標簽類型選擇器和偽對象選擇器
  • 忽略全局選擇器
    ID > 類 | 偽類 | 屬性選擇 > 標簽類型|偽對象 > 通配符
    就近原則

em px 以及百分比

  • em 設置相對字體大小,尺寸隨著字體的改變而改變
  • 百分比 尺寸隨著父元素尺寸的改變而改變

高效組織

  • CSS應該是高效清晰并且結構明確的代碼文件
  • 通用類和業(yè)務類
  • 樣式聲明的順序
    應該按照模板中元素的層級關系來處理

適當定義排序

參考 《Web前端開發(fā)最佳實踐》

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • CSS編碼規(guī)范 1 前言 CSS作為網(wǎng)頁樣式的描述語言,在百度一直有著廣泛的應用。本文檔的目標是使CSS代碼風格保...
    春木橙云閱讀 327評論 0 0
  • CSS編碼規(guī)范 1 前言 CSS 作為網(wǎng)頁樣式的描述語言,在百度一直有著廣泛的應用。本文檔的目標是使 CSS 代碼...
    Top_Chenxi閱讀 197評論 0 0
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 14,151評論 1 92
  • 有一天,我在樓下的小倉庫里整理圖書。 這個時候門口有一位媽媽經(jīng)過,停下來看了我滿屋子的書。 她就問我:“我注意你很...
    四次元口袋娃閱讀 436評論 0 0
  • 我跟醫(yī)生說我好久沒有拔牙了。 上一次,大概是二十年前。 我記得上一次看牙的時候,牙醫(yī)是個年輕的女醫(yī)生,皮膚白皙,睫...
    維忒閱讀 584評論 0 0

友情鏈接更多精彩內(nèi)容