2025年05月20日(火)
このアイデアはすごい！ テーブルでセルの行を強調表示、さらにそれ以外の部分はぼかして目立たせるCSSのテクニック
テーブルでセルをハイライトして目立たせるというのはよくあるテクニックですが、さらにそれ以外のセルはぼかしてより目立たせるCSSのテクニックを紹介します。
実装のポイントは、:focus-within疑似クラスと:not()否定疑似クラスです。
まずは、実際のデモをご覧ください。
上部でダーク・ライトモードにしたり、アクセントカラーを変更できます。
author:
コリス
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログ
‹ PREV
中小企業やフリーランサー向けに開発されたオープンソースの請求書ソリューション・「Solidinvoice」
NEXT ›
Webブラウザ向けAIエージェントを構築するためのオープンソースのフレームワーク・「Notte」
Ads
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログコリスの記事『このアイデアはすごい！ テーブルでセルの行を強調表示、さらにそれ以外の部分はぼかして目立たせるCSSのテクニック』についてまとめています。
この記事は特にSEO・twitter・Macについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のコリスで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとコリスの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
0
27
95
23
