Sass
Sass：HTMLに「clearfix」を書くのを卒業しよう
HTMLコーディングに欠かせないclearfixですが、気付けばHTML各所にclearfixの記述が多くなることがあります。 Sassのextendを使って個別にclearfixを記述することから卒業しましょう。 CS…Compass(Sass)：標準mixinを使いこなそう
Compassにはmixinで作らずとも標準で利用できるmixinが存在します。 ベンダープレフィックスを付けて複数書かなければならないプロパティを簡単に書けるものが多いです。 @include border-radiu…Compass：IEにも対応したCSSグラデーションの書き方
Compassでザックリ書き出す方法です。 Scss //SVGサポートを有効に（IE9用） $experimental-support-for-svg: true; .box { //モダンブラウザ用グラデーション @…Sass：extendでベンダープレフィクス要素を削減する
Sassのextendを使った記法を広めたいのでまたまた応用方法をご紹介します。 改善前CSS .box1 { width: 300px; padding: 10px; -webkit-box-sizing: borde…Sass：extendでclearfixを楽にする
先日オブジェクト指向型CSSについて書きましたが、こちらのおさらいと応用を紹介します。 回り込み解除のための「clearfix」はWebコーダーであれば誰しも使うクラスだと思いますが、HTML内でそこかしこに clear…Sassではじめる擬似オブジェクト指向型CSS
「オブジェクト指向型CSS」といっても新しい記法などではなく、CSSの組み方の概念を指します。CSSの効率化を考えている人は無意識的にすでにやっているかも知れません。 たとえば下記のようなCSSがあったとします。 .bo…Sass：実はプロパティもネストできる。
Sassはセレクターをネスト構造にしてシンプル化できるのが魅力ですが、実はCSSプロパティもネスト構造で記述することができます。 Sass .box { font: { weight: bold; size: 12px;…