Front-end Development--css attribute writing order

CSS property Order is part of the CSS good coding style, which helps to improve code readability, facilitates the discovery of code problems, and facilitates teamwork. (After Row)

Example {

/* Display Properties */
Display:;
Visibility:;
float:;
Clear:;

/ * Positional properties * /

Position:;
Top:;
Right:;
Bottom:;
Left:;
Z-index:;

/ * Box Model properties * /

Width:;
Min-width:;
Max-width:;
Height:;
Min-height:;
Max-height:;
Overflow:;

margin:;
Margin-top:;
Margin-right:;
Margin-bottom:;
Margin-left:;

padding:;
Padding-top:;
Padding-right:;
Padding-bottom:;
Padding-left:;

border:;
Border-top:;
Border-right:;
Border-bottom:;
Border-left:;

/ * Show additional properties * /
Outline:;
List-style:;

/* Table Properties */
Border-collapse:;
Empty-cells:;


/ * Text properties * /

Font:;
Font-style:;
Font-weight:;
Font-size:;
Line-height:;
Font-family:;
Text-align:;
Text-indent:;
Text-decoration:;
Letter-spacing:;
Word-spacing:;
White-space:;
Vertical-align:;
Color:;

/* Background Properties */
Background:;
Background-color:;
Background-image:;
Background-repeat:;
Background-position:;

/ * Other properties * /

Opacity:;
Cursor:;
Content:;

}

Front-end Development--css attribute writing order