空格

以下几种情况不需要空格:

  • 属性名后
  • 多个规则的分隔符','前
  • !important '!'后
  • 属性值中'('后和')'前
  • 行末不要有多余的空格

以下几种情况需要空格:

  • 属性值前
  • 选择器'>', '+', '~'前后
  • '{'前
  • !important '!'前
  • @else 前后
  • 属性值中的','后
  • 注释'/'后和'/'前
  1. /* not good */
  2. .element {
  3. color :red! important;
  4. background-color: rgba(0,0,0,.5);
  5. }
  6. /* good */
  7. .element {
  8. color: red !important;
  9. background-color: rgba(0, 0, 0, .5);
  10. }
  11. /* not good */
  12. .element ,
  13. .dialog{
  14. ...
  15. }
  16. /* good */
  17. .element,
  18. .dialog {
  19. }
  20. /* not good */
  21. .element>.dialog{
  22. ...
  23. }
  24. /* good */
  25. .element > .dialog{
  26. ...
  27. }
  28. /* not good */
  29. .element{
  30. ...
  31. }
  32. /* good */
  33. .element {
  34. ...
  35. }
  36. /* not good */
  37. @if{
  38. ...
  39. }@else{
  40. ...
  41. }
  42. /* good */
  43. @if {
  44. ...
  45. } @else {
  46. ...
  47. }