自分内での主な規約をメモ書きして置こうと思います。
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宣言の順序
1:Positioning(位置関係)
2:Box model(ボックスモデル)
3:Typographic(フォント関係)
4: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;
}