index.html 1.83 KB
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>맛집지도</title>
    <meta name="author" content="양주미" />
    <meta name="description" content="맛집지도 서비스" />
    <meta
      name="keywords"
      content="맛집지도, 맛집추천, 실시간채팅"
    />
    <link rel="stylesheet" href="style.css" />
  </head>

  <body>
    <nav>
      <div class="inner">
        <div class="nav-container">
          <h1 class="nav-title">맛집지도</h1>
          <button class="nav-contact">Contact</button>
        </div>
      </div>
    </nav>

    <main>
      <section id="category">
        <div class="inner">
          <div class="category-container">
            <h2 class="category-title">💜맛집지도 카테고리를 선택해보세요💜</h2>
            <div class="category-list">
              <button class="category-item">한식🍚</button
              ><button class="category-item">중식🍜</button
              ><button class="category-item">일식🍙</button
              ><button class="category-item">양식🍝</button
              ><button class="category-item">분식🍭</button
              ><button class="category-item">구이🍖</button
              ><button class="category-item">회/초밥🍣</button
              ><button class="category-item">기타🍴</button>
            </div>
          </div>
        </div>
      </section>
      <!-- 카테고리 -->
      <div id="map" class="inner"></div>

      <!-- 카카오지도 -->
    </main>

    <script 
    type="text/javascript" 
    src="//dapi.kakao.com/v2/maps/sdk.js?appkey=2263ae9eb197ad864a94eb1ed7b912c9">
</script>

    <script src="script.js"></script>
  </body>
</html>