IT the Best

はてなブログのカスタマイズ情報を中心に、WEBデザインからJavaScriptまでWEB系の開発情報を発信します。便利ツールや暇つぶしのゲームなど開発物も公開します。

CSS-transform

【HTML】画像やアイコン・文字などを反転させる - scale()を使った方法

Photo by Devin Avery on Unsplash scale()を使ったHTML要素を反転させる方法 コード 見本 通常 反転 上下反転 scale()を使ったHTML要素を反転させる方法 [HTML] [CSS] [スタイル] コード transform:scale(-1,1); 見本 通常 通常 HTML CSS JS 5 Photo by Thi…

transform:scale() - マウスホバー時に写真などを縮小/拡大する | CSS Introduction

transform:scale()関数をマウスホバー時に設定して写真などの要素を強調表示させる。transform:scale()transformプロパティのscale()関数は、要素の大きさを水平方向と垂直方向に対して変更することができます。要素をマウスホバー時に拡大/縮小することで強…

【WEBデザイン】CSSで画像をホバー時にハイライトさせてオシャレにする

記事トップ画像のように、マウスホバー時に画像を拡大/縮小・ぼかしをしてハイライトさせます。cssの「transition」「opacity」「transform」プロパティの3つを使用しています。サンプル(マウスホバー時)拡大/縮小ぼかし透明度の値:0.5変化時間の設定説明tr…