주석(Comment)
HTML에서 주석(코멘트)
은 웹 페이지에 표시되지 않는 메모나 설명을 작성합니다.
주로 코드에 대한 설명이나 수정 내용, 작성자 정보 등을 코드에 기록할 때 사용합니다.
코드프렌즈 웹 코딩 실습 환경은 HTML 코드의 주요 부분에 주석을 활용해 학습자 분들이 코드를 더 쉽게 이해할 수 있도록 돕습니다.
주석은 어떻게 사용하나요?
HTML 주석은 <!--
로 시작하고 -->
로 끝납니다.
주석으로 감싸진 모든 내용은 웹 페이지에서 보이지 않습니다.
<!-- 이 줄은 주석입니다. 웹 페이지에 표시되지 않습니다 --> <p>이 문장은 웹 페이지에 표시됩니다.</p>
주석은 언제 사용할까요?
주석은 주로 다음과 같은 상황에 사용합니다.
코드 설명
복잡한 코드나 나중에 수정할 수 있는 부분에 대한 설명을 추가할 수 있습니다.
코드 비활성화
특정 코드 부분을 잠시 비활성화하고 싶을 때 주석로 감쌀 수 있습니다. 주석으로 처리된 코드는 웹 페이지에 표시되지 않습니다.
<!-- 아래의 이미지는 임시로 비활성화합니다. <img src="example.jpg" alt="예시 이미지"> -->
섹션 분리
웹 페이지의 다른 섹션을 구분하기 위해 주석을 사용할 수도 있습니다.
예를 들어 주석으로 웹사이트의 다음과 같은 섹션을 구분할 수 있습니다.
-
헤더(header)
: 웹페이지 상단의 머리말로 로고, 주요 메뉴(내비게이션), 검색창 등을 포함 -
본문(main)
: 웹사이트의 핵심 콘텐츠 포함 -
푸터(footer)
: 웹페이지 하단에 사이트 정보(소셜 미디어, 저작권 표시 등) 포함
<!-- 헤더 시작 --> <header>...</header> <!-- 헤더 끝 --> <!-- 본문 시작 --> <main>...</main> <!-- 본문 끝 --> <!-- 푸터 시작 --> <footer>...</footer> <!-- 푸터 끝 -->
이렇게 HTML 주석은 코드의 가독성을 높이고, 다른 개발자와의 협업을 용이하게 돕습니다.
실습
코드의 별표로 강조된 부분을 따라 입력해 보세요.
HTML 주석 만들기
아래 내용을 주석으로 바꾸기 위한 HTML 코드를 작성해 보세요.
힌트: HTML 주석은 <!--
으로 시작하고 -->
로 끝납니다.
본문 내용
학습 자료
AI 튜터
배포
디자인
업로드
수업 노트
즐겨찾기
도움말