map.html

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>세계지도</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f2f2f2;
            margin: 0;
            padding: 20px;
        }
        h1 {
            color: #333;
        }
        .map-container {
            margin: 20px 0;
            max-width: 800px; /* 지도의 최대 너비 설정 */
            height: 500px;  /* 지도의 높이 설정 */
        }
        iframe {
            width: 100%; /* 전체 너비 사용 */
            height: 100%; /* 전체 높이 사용 */
        }
    </style>
</head>
<body>
    <h1>한국 지도</h1>
    <p>아래는 구글 지도를 삽입한 것입니다.</p>

    <div class="map-container">
        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3162.449140451183!2d126.97796931530989!3d37.56653527975921!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x357ca18b3f08bb2b%3A0x1e6b7dce18f7c29d!2z7Jmy7Iqk7KCE7ISc7K0!5e0!3m2!1sen!2sus!4v1646330526110!5m2!1sen!2sus" allowfullscreen="" loading="lazy"></iframe>
    </div>

    <h3>페이지 이동</h3>
    <p><a href="index.html">메인 페이지로 돌아가기</a></p>
    <p><a href="additional.html">추가 페이지로 가기</a></p>
</body>
</html>