入れ子の親要素と子要素のoverflow:hidden;を使って画像をトリミング表示

元画像


トリミング表示

子要素(画像サイズ)よりも小さな範囲を親要素で指定。
はみ出た部分をoverflow:hidden;を使って消す。
子要素はposition:relative;を使って、ポジショニング。
使い道は、1枚の画像を使って部分説明などに(CSSスプライトと同様)。