サムネイル（アスペクト比指定）を作ってみました。
（css「aspect-ratio」の練習＋備忘録）

特徴

アスペクト比の設定可（例＝16：9）

コード

html構成

<ul>
<li><img><li>
<li><img><li>
</ul>

1枚目：横長画像
2枚目：縦長画像
で確認しています。

CSS構成

li {
width: 100px;
aspect-ratio: 16 / 9;
}
img {
display: block;
object-fit: cover;
width: 100.1%;
height: 100.1%;
}

課題

サムネイルサイズによっては、画像下に隙間ができる。
↓
<img>サイズを100.1%で、隙間を埋めてみました。
きれいに100%にしてあげたいです。