[CSS]実はかなり便利！意外と見落とされがちなスタイルシートのテクニックのまとめ
Webはその進化が早いと言われ、中でもCSSは日々、新しいテクニックや驚くべき実装方法が発表されています。新しいものに目を向けることはもちろん大切です。しかし、すでに利用可能なもので見落としている有用なテクニックがあるかもしれません。 有用なのに、意外と見落とされがちなCSSのテクニックを紹介します。 9 Underutilized Features in CSS 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 1. レスポンシブ対応に便利な「calc()」 2. 目からウロコの「@media」の使い方 3. カラー指定を変数でおこなえる「currentColor」 4. フォームにかなり便利「:valid, :invalid, :empty」 5. ナンバリングするためにol要素は必要ない「counter」 6. 中身が不明な
![[CSS]実はかなり便利！意外と見落とされがちなスタイルシートのテクニックのまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/11d487ffaa0d8f97196e7f7cedd83ea94e889a64/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201604%2F2016102601.png)
[CSS]多階層のリスト要素をツリー状にデザインするスタイルシートのテクニック
画像を使用せずに、多階層のリストをツリー状にデザインするスタイルシートのテクニックを紹介します。 ピュアCSSなので、リストのアイテムは増やしても減らしても、ツリー状のスタイルを適用できます。 Parent child vertical list menu コードはこんな感じです。 HTML リストは階層ごとに入れ子を使用します。 コードは、CodeのjQueryまで。 <nav class="nav"> <ul class=list> <li> <a href="#">Home</a> <ul> <li> <a href="#">Lab</a> <ul> <li> <a href="#">Code</a> <ul> <li> <a href="#">Html</a> </li> <li> <a href="#">Css</a> </li> <li> <a href="#">Jquery<
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
