두 번째 템플릿 구성요소 살펴보기

두 번째 템플릿의 주요 섹션 및 구성을 살펴보겠습니다.

<header>

• 이 섹션은 웹 페이지의 상단에 위치하며, 주로 탐색과 관련된 요소를 포함합니다.
  • .header-icon: 웹 사이트의 로고 아이콘을 나타냅니다.
  • <nav class="navigation">: 주요 탐색 바로서 메뉴 항목들을 포함하고 있습니다.
  • .dropdown: 모바일 환경에서 주로 사용되는 햄버거 메뉴 형태의 드롭다운입니다. 주요 탐색 링크를 포함하고 있습니다.

<main>

• 웹 페이지의 주요 내용을 담는 섹션입니다.
  • <section id="intro">: 웹 페이지의 시작 부분으로, "PROJECT Seoul"에 대한 간단한 소개와 이미지를 포함하고 있습니다.
  • <section id="about">: 웹 사이트나 회사에 대한 간단한 소개와 관련 이미지를 포함하고 있습니다.
  • <section id="focus">: 회사의 주요 목표나 중점사항을 나타내는 섹션입니다.
  • <section id="project">: 회사의 주요 프로젝트들을 이미지와 함께 소개하는 섹션입니다.
  • <section id="contact">: 방문자들이 메시지를 남길 수 있는 연락처 폼과 함께 이미지를 포함하고 있는 섹션입니다.

<footer>

• 웹 페이지의 하단에 위치한 푸터 섹션입니다.
  • .footer-contact-box: 연락처 관련 정보(전화번호 및 이메일)를 포함하고 있습니다.
  • .footer-license: 로고와 저작권 관련 텍스트를 포함합니다.
  • .social-icons: 회사의 소셜 미디어 링크 아이콘들을 포함하고 있습니다.