CSS中的编写规范

注意!

<1>border: solid _px color;

      [注意不用","只需" "即可]

<2>border-radius: _px _px _px _px;

      [先是top-left再是top-right接着是bottom-right最后是bottom-left]

      [注意不用","只需" "即可]

<3>padding: _px _px _px _px;

      [先是top再是right接着是bottom最后是left]

      [注意不用","只需" "即可]

<4>margin: _px _px _px _px;

      [先是top再是right接着是bottom最后是left]

      [注意不用","只需" "即可]

<5>filter: blur(_px) grayscale(_%) opacity(_%) saturate(_%) brightness(_%) contrast(_%);

      [blur:0px-100px(模糊度增强)

       grayscale:0%-100%(灰度增强)

       opacity:0%-100%(清晰度增强)

       saturate:0%->100%(饱和度增强)

       brightness:0%->100%(亮度增强)

       contrast:0%->100%(对比度增强)]

      [注意不用","只需" "即可]

<6>background: linear-gradient(_deg, color, color, color);

      [默认从上到下(不编写degree时)

       0deg,[从下到上]

       45deg,[从左下到右上]

       90deg,[从左到右]

       …

       [0~360deg,(顺时针)]

      [注意既需要","又需要" "]

<7>_, _ {

}

      [注意既需要","又需要" "]

<8>class="color italic bold"

      [注意不用","只需" "即可]

<9>flex: 0 1 auto;（这里均为默认值)

      [先是flex-grow再是flex-shrink最后是flex-basis]

      [注意不用","只需" "即可]

<10>grid-template-rows: auto auto;

      grid-template-rows: _px _px;

      grid-template-rows: _fr _fr;

      grid-template-rows: -% -%;

      grid-template-rows: repeat(2, _fr);

同理

      grid-template-columns: auto auto;

      grid-template-columns: _px _px;

      grid-template-columns: _fr _fr;

      grid-template-columns: -% -%;

      grid-template-columns: repeat(2, _fr); 

      [注意不用","只需" "即可]

<11>grid-template: _px _px / _px _px;

      grid-template: _fr _fr / _fr _fr;

      grid-template: _px _px / _fr _fr;

      grid-template: _fr _fr / _% _%;

      [先是row是column]

      [注意不用","只需" "即可]

<12>gap: _px _px;

      [先是row是column]

      [注意不用","只需" "即可]

<13>grid-row: span 1;

同理

      grid-column: span 1;

      [注意不用","只需" "即可]

<14>grid-template-areas: ". item1 . item2";

      grid-template-areas: "item1 item2" "item3 item4";

      ["."代码运行出来表现为"空区域"]

      [注意不用","只需" "即可]

------------------------------------------

以上所用符号均在英文输入状态下输入,阅读时需注意!

毕竟我只是个刚入行的小白,错误在所难免.所以如有任何错误欢迎大家指出,我必及时更改.

多谢.🙏🙏🙏🙏🙏