月別アーカイブ: 2016年4月

BootstrapのLESSで使われているループを応用してCSSユーティリティを作成

CSSでマージンをつけるだけのユーティリティ、みなさんも使用されていることがあるかと思います。

.mb10 {
margin-bottom: 10px;
}
.mb20 {
margin-bottom: 20px;
}

・・・これをまあ続けていくわけですけど、昔は画面の大きさもさほど大きくなかったしまあmb40とかmt40くらいまであればいいかなーと考えてましたが、最近は解像度もでかいし、デザイン性もいいサイトもいっぱいあったりして、マージンの使い方も美しいんですよね。

なもんで、最近は自分の場合は.mb100くらいまで用意します。
しかも5px刻みで。

なのでCSSをあらかじめ準備しとかないとイチから書いてると途方も無いことになる。(ってほどではないけど)

続きを読む