マウスオーバーした時に画像がふわっと大きくなる方法
19.04.05
マウスオーバーした時に画像がふわっと大きくなる方法。
HTML
1 2 3 |
<a href="#" id="test"> <img src="#.png"> </a> |
CSS
1 2 3 4 5 |
#test:hover img { -webkit-transform: scale(1.2); transform: scale(1.2); transition-duration: 0.5s; } |
transform: scale(1.2)で1.2倍の大きさに。transition-duration: 0.5s;で0.5秒かけて変化する。
関連記事
-
2018.10.27 秀丸 ファイルを見比べる方法やgrepを使ってフォルダ内のファイルを検索する方法。
-
2022.07.12 Googleフォントを手軽にcssで使う方法
-
2023.12.20 WordPress カスタム投稿タイプのパーマリンクを思い通りに変更する方法
-
2022.05.09 Xサーバーメールアドレスの追加方法
-
2018.11.09 サクラサーバーで無料SSLを利用する方法