Sass：連番付きid・classをゼロパディング（ゼロ埋め）で出力する方法 - NxWorld
Sassを利用してて連番付きのidまたはclassを一気に出力したいときに、item1, item2, item3 ... のように単純に1から始まる連番をつけて出力するのではなく、item01, item02, item03 ... のようなゼロパディング（ゼロ埋め）な連番で出力させる方法です。 ゼロパディングとは ゼロパディングとは、足りない桁数の分だけ「0」を追加して埋めるというものです。 具体的な例としては、1, 2, 3, 4, 5という数字の場合であっても桁数を2桁にする必要があるときは01, 02, 03, 04, 05にするというものになります。 単純な連番付きで出力する 違いを見るために、まずは単純な連番付きで出力してみます。 今回はサンプルとして.item ＋ 連番のようなclassを出力するというもので、連番は1～10まで出したいという場合は@forを利用してSCSS
Sassでコンパイル時の出力を変更するオプション | びーおーぷんどっとねっと
sassファイルをコンパイルして出力するときのスタイルを変更するオプションについて。 それぞれ出力したときのインデントが違います。 スタイルは４種類。 「:nested」「:expanded」「:compact」「:compressed」。 スタイルはコンパイル時に指定します。 $sass filename.scss filename.css --style expanded オプションをつけないデフォルトの出力は「:nested」になります。 出力の例 file.scssを以下のように作りました。これを各スタイルでコンパイルします。 #main { margin: 10px; p { padding: 10px 5px; red { color: #D22B4C; } } .contents { font-size: 10em; } } :nested #main { margin:
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
4.隣接セレクタ、間接セレクタ、直下セレクタ ー フロントエンドエンジニアのための「Sass」講座 | Aire Project Blog
