index.html
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>高解像度ディスプレイに対応した画像設定</title> <style> *{ margin: 0; padding: 0; } p{ width: 320px; margin: 20px auto; } .photo{ width: 300px; margin: 40px auto; } img{ max-width: 100%;/* フルードイメージ */ } </style> </head> <body> <p><img src="img/logo.svg" alt=""></p> <p><img src="img/logo.jpg" alt=""></p> <div class="photo"> <img src="img/300.jpg" alt=""> </div> <div class="photo"> <img src="img/600.jpg" alt=""> </div> </body> </html>