【vscode】Web制作のコーディング規約について

自分内での主な規約をメモ書きして置こうと思います。

CSSシンタックス

• インデントは半角スペース2個
• 開き波括弧の前に1つの半角スペースを入れる。
• 小数点以下の値を指定する時、1の位が0なら省略
  例: 0.5ではなく.5。-0.5pxではなく-.5px
• 可能な場合は省略形のhex型の値を使う。
  例: #ffffffではなく#fff
• 0の値には単位を指定しない。
  例: margin: 0px;ではなくmargin: 0;

コードで例えると（良い例）

.selector,
.selector-secondary,
.selector[type="text"] {
  padding: 15px;
  margin-bottom: 15px;
  background-color: rgba(0,0,0,.5);
  box-shadow: 0 1px 2px #ccc, inset 0 1px 0 #fff;

CSS宣言の順序

１：Positioning（位置関係）
２：Box model（ボックスモデル）
３：Typographic（フォント関係）
４：Visual（見た目）

コードにすると

.priority {
  /* Positioning （位置関係）*/
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;

  /* Box-model（ボックスモデル） */
  display: block;
  width: 100px;
  height: 100px;

  /* Typography （フォント関係）*/
  font: normal 13px "Helvetica Neue", sans-serif;
  line-height: 1.5;
  color: #333;
  text-align: center;

  /* Visual （見た目）*/
  background-color: #f5f5f5;
  border: 1px solid #e5e5e5;
  opacity: 1;
}

---

---

---

---