Stylus で z-indexの管理
z-indexの管理方法で、Sassy Z-Index Management For Complex Layoutsが参考になったので、Stylus版を作ってみた。 Stylusの関数に目を通したけど、index()がなかったので、forで回してる。 DEPTH変数に、クラス名とかスペース区切りで突っ込んで、入っているクラスを呼び出せば、z-indexが出力される。 これで数値がかぶることもないし、DEPTH変数の中のクラス名の順序を入れ替えるだけで、深度を調整できる。 Stylus Mixin Z_INDEX(CLASS_NAME) // classをスペース区切り設定する DEPTH = header footer hoge base__element DEPTH_LENGTH = length(DEPTH) for INDEX in 0..DEPTH_LENGTH if DEPTH[
Sassの@contentを使用したMedia Queries
表題についての補足。 @mediaに@contetを利用する方法は、Sassの見通しが良くなるというメリットがあるけども、CSSを見ると余計な記述が増えているのが分かる。 .foo { @include mediaquery-smartphone { width: 100%; font-size: 100%; } } .hoge { @include mediaquery-smartphone { width: 100%; } } ↓ @media only screen and (max-width: 499px) { .foo { width: 100%; font-size: 100%; } } @media only screen and (max-width: 499px) { .hoge { width: 100%; } } @mediaのmixinを展開すると、「@media
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
