css选择符归类的方法

发布时间:2021-01-02编辑:脚本学堂
本文中简单讲css选择符归类的几种方法,需要了解相关知识的朋友一定要看看。

如果想让自己的css文件条理清晰,简单整洁,一直保持有规则性,有组织性,最好的方法就是把你的选择符进行简单的归类。
       

复制代码 代码示例:
   reset styles
   typography styles
   layout styles (header, content, footer, etc.)
   module or widget styles
   etc.
 

首先,在每一个组里面,通过dom层组织选择符。
        

复制代码 代码示例:
 any parent styles (containing elements, working outside-in)
   block-level element styles (paragraphs, lists, etc.)
   inline element styles (links, abbreviations, etc.)
   etc.
 

其次在这里面,根据元素的类型工作:
    

复制代码 代码示例:
paragraphs
   blockquotes
   addresses
   lists
   forms
   tables
   etc.
 

最后,把css的声明也按上述进行归类。
    

复制代码 代码示例:
positioning (with coordinates) styles
   float/clear styles
   display/visibility styles
   spacing (margin, padding, border) styles
   dimensions (width, height) styles
   typography-related (line-height, color, etc.) styles
    miscellaneous (list-style, cursors, etc.) styles
 

根据自己的需要,每个人都会有一套属于自己的方法,不管你选择什么样的方法,要坚持下去才能达到一定的效果。