数量セレクタ（Quantity Queries）
2015年11月10日 著 日本語では何て訳すのが一般的かわかりませんが、Quantity Queriesをここでは「数量セレクタ」と称することにします（厳密には「数量クエリー」なのでしょうけど、セレクタと呼んだほうがしっくりしたので）。しばらく前からその数量セレクタに関する記事はいくつか見かけたことがあり、実際A List Apartの記事「Quantity Queries for CSS」も斜め読んではいたのですけど、正直あまりちゃんと理解していませんでした。 昨日、偶然「Using Quantity Queries to write content-aware CSS」という別の記事を読んだところ、そこにあった解説が非常に分かりやすかったのと、著者が実際にそれを使った実例（タグクラウドの実装）をアニメーションで表示してくれていたのを見、ようやく腹落ちしたというか、そういうことだったの
「数が増えてもこわくない！Quantity Queriesの紹介」というセッションでCSS Talk Vol2 で登壇しました | 活動 | mkasumi.com
CSS Talk vol.2に登壇しました。とても雰囲気のいい勉強会で、話す側としてもとても楽しい時間を過ごせました。 今回は、CSSネタということで、私自身がCMSを作っている会社に所属しているので、自己紹介ついでに動的コンテンツに対応したレイアウトを提供できる「Quantity Queries」についてご紹介しました。 ざっくりどんなことができるのかというと、たとえば、li要素の幅を25%幅にしていて、要素が4つしか入らないCSSの設計になっていたとします。そんな場合にCMSからお客さんが5つめのコンテンツを投入すれば普段であれば当然レイアウトが崩れてしまいますが、Quantity Queriesは解決することができます。どうやって解決できるのかというと、たとえば要素が5つ以上になったときにli要素の幅をautoにして、さらにdisplay:inline-block;を追加し、レイアウ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
