【概要】
CSSで画像のリサイズ／切り抜きを実現。

【ポイント_CSS】
.resize_div{ width: 横幅; height: 縦幅; overflow: hidden;}
.resize_img{ width: 横幅;}

【ポイント_HTML】
<div class="resize_div">
<img src="ファイルまでのパス" class="resize_img" />
</div>

【説明】
「resize_div」
画像を囲むdivで、[ width ]と[ height ]を表示させたい画像のサイズにします。
[ overflow: hidden ]を指定する事により、指定したサイズを超えた画像が表示されずに切り抜かれます。

「resize_img」
imgに[ width ]（もしくは[ height ]）のみを指定すると縦横の比率を保ったまま拡大・縮小することが出来ます。
[ padding-left: -50px; ]というようにマイナスで指定する事によって左や上に画像をずらす事も出来ます。

【元画像】

【画像の横幅を200pxに指定】

【外枠のdivを100px×100pxに指定】