CSSで画像要素をブロック内に中央揃えする方法

1. Flexboxを使用する方法:

   .container {
   display: flex;
   justify-content: center;
   align-items: center;
   }

   <div class="container">
   <img src="画像のURL" alt="画像の説明">
   </div>

2. text-alignプロパティを使用する方法:

   .container {
   text-align: center;
   }
   .container img {
   display: inline-block;
   }

   <div class="container">
   <img src="画像のURL" alt="画像の説明">
   </div>

3. 絶対位置指定を使用する方法:

   .container {
   position: relative;
   }
   .container img {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   }

   <div class="container">
   <img src="画像のURL" alt="画像の説明">
   </div>

これらの方法を使用することで、画像要素をブロック内に中央揃えすることができます。適用したい方法を選んで、コードを適用してください。