<div class="grid-container">
  <img src="image_01.jpg" alt="画像1">
  <img src="image_02.jpg" alt="画像2">
  <img src="image_03.jpg" alt="画像3">
  <img src="image_04.jpg" alt="画像4">
  <img src="image_05.jpg" alt="画像5">
  <img src="image_06.jpg" alt="画像6">
  <img src="image_07.jpg" alt="画像7">
  <img src="image_08.jpg" alt="画像8">
  <img src="image_09.jpg" alt="画像9">
</div>
  

.grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 画面サイズ問わず3列固定 */
  gap: 0; /* 隙間をゼロにする */
  width: 100%; /* 横幅いっぱいに広げる */
  max-width: 800px; /* お好みの横幅（pxなど）に変えてください */
  margin: 0 auto;  /* 画面が800px以上になったとき、全体を中央に配置する */
}

.grid-container img {
  width: 100%;
  height: auto; /* 元の縦横比を完全に維持 */
  display: block; /* 画像の下にできる数ピクセルの隙間を消す */
  outline: 1px solid transparent; /* アンチエイリアス（ギザギザ）の補正 */
  transform: scale(1.005); /* ほんの少しだけ画像を拡大して隙間を埋める */
}