2026年03月17日(火)
これは覚えておきたい！ シンプルなCSSで、画像をホバーすると拡大し、マスクまでしてくれる
画像をホバーすると拡大するCSSのテクニックは昔からありますが、画像の拡大分をoverflow:hidden;で非表示にするのではなく、clip-pathでクリッピングするとってもシンプルなCSSを紹介します。
実際の動作は、デモページをご覧ください。
See the Pen
画像をホバーすると拡大、マスク 2 b...
0
0
19
0author:
コリス
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログ
‹ PREV
Slack代替としてNext.jsベースで開発されたオープンソースのチームコミュニケーションプラットフォーム・「OpenHive」
NEXT ›
AIによる類似カラーの提案機能も付いたオープンソースのWCAG準拠チェックが可能なWebカラーツール・「Smart Color Contrast Assistant」
Ads
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログコリスの記事『これは覚えておきたい！ シンプルなCSSで、画像をホバーすると拡大し、マスクまでしてくれる』についてまとめています。
この記事は特にアニメーション・Android・SVG・SEO・twitter・Mac・iOS・Windowsについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のコリスで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとコリスの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
