- 1. 訂正 2018年3月5日
- 2. 概要
- 3. まとめて記述
- 4. 参考サイト
1. 訂正 2018年3月5日
今やこんな記事を書いたことを後悔しております。
「Autoprefixer」を使えば、こんな面倒くさいことは必要ないのです。
なので、以下は『ちゃい』です。
「Autoprefixer」を使いましょう。
まぁ、これも、必要なくなってきたな（2026年9月30日）。
2. 概要
「.css」には方言が多くて・・・。
タブサイズを指定するのに。
tab-size: 4; ← 一般？
-moz-tab-size: 4; ← Firefox？
みたいなことを書くので、あちこちに出現する場合、２行ずつ増えていくという、効率の悪いことになるのです。
3. まとめて記述
「.scss」ではこれをまとめて記述できるようで・・・。
$set-prefix: '' , -moz-;
@mixin propertySetPrefix($name, $value)
{
@each $prefix in $set-prefix
{
#{$prefix}#{$name}: $value;
}
}
div.tab4
{
@include propertySetPrefix(tab-size, 4);
}
と書いておけば、コンパイル後の「.css」には、下記のように展開されます。
div.tab4 {
tab-size: 4;
-moz-tab-size: 4;
}
うむ、便利。
4. 参考サイト
本ページは、下記のサイトを参考にさせていただきました。
「Sassでベンダープレフィックスを自動で付与する」
|
|
