<!DOCTYPE html>
<html>
<body>
<h2>object-fitを使用</h2>
<p>ここでは「object-fit: cover;」を使用しているため、ブラウザ ウィンドウのサイズを変更しても画像のアスペクト比が維持されます。</p>
<div style="width:100%;height:400px;">
<img src="https://img-techis-jp.sgp1.digitaloceanspaces.com/css/rock600x400.jpg" alt="Norway" style="float:left;width:50%;height:100%;object-fit:cover;">
<img src="https://img-techis-jp.sgp1.digitaloceanspaces.com/css/paris.jpg" alt="Paris" style="float:left;width:50%;height:100%;object-fit:cover;">
</div>
</body>
</html>
