MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました SassやLESSは一旦覚えてしまえば手軽に使えますが、最初の覚えるまでが面倒というイメージがあるかも知れません。また、デファクトがまだ定まっていない雰囲気もあり、どちらかだけを使っているとプロジェクトによっては別な方を選択する可能性もあります。 そこで試してみたいのがRucksackです。ほぼ素のスタイルシートながら、関数的に特定の書き方を展開してくれるツールです。 Rucksackの使い方 rucksackはいわばスタイルシート用の関数のようなものです。例えば文字サイズをレスポンシブにしたい場合は次のように記述します。 .foo { font-size: responsive; } これは次のように展開されます。 .foo { font-size: calc((12px - 4
![Rucksack - スタイルシートの面倒なところを簡単に](https://cdn-ak-scissors.b.st-hatena.com/image/square/5b77db804c69b51b3167dd1e1ade43bf4e33b573/height=288;version=1;width=512/https%3A%2F%2Fmoongift-assets.s3.amazonaws.com%2Fassets%2Fnone-c3f80f5acd8206a735bb12db1e77cb6d.png)