CSS3の「transform:scale()」を使用すると要素や画像を拡大・縮小して表示することができます。

画像をマウスオーバーした時にその画像を少し拡大させて表示させるなどをすると、
サイトに動きを出すことができるのでいいと思います。

下記にCSS3の「transform:scale()」を使用して画像をマウスオーバーした時に
拡大させて表示した時の方法をメモします。

■ 「transform:scale()」の使用方法

ブロック要素を固定させて画像を拡大させた場合の方法です。
画像をマウスオーバーするとアニメーションで拡大します。

【CSS】

.scale {
	width: 400px;
	height: 300px;
	overflow: hidden;
}
.scale img {
	-moz-transition: -moz-transform 0.5s linear;
	-webkit-transition: -webkit-transform 0.5s linear;
	-o-transition: -o-transform 0.5s linear;
	-ms-transition: -ms-transform 0.5s linear;
	transition: transform 0.5s linear;
}
.scale img:hover {
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

※「transition: all 0.5s linear;」で指定してもOKです。
allの場合は全てのプロパティに適用されます。

【HTML】

<div class="scale">
    <img src="./css_scale.jpg">
</div>

【表示例】

サンプルページ：【CSS】画像の拡大・縮小表示

「scale()」は下記のようにX方向とY方向で指定することもできます。

transform: scale(1.2,1.2);

また、縮小させて表示させたい場合は(0.8)のように1よりも小さい値を指定します。

サイト内の画像をマウスオーバーした時に動きを出したい場合など色々と利用できそうです。