HTML의 content(콘텐츠) 속성은 <meta> 요소와 함께 사용되며, name 또는 http-equiv 속성으로 지정된 항목에 해당하는 값을 정의하는 역할을 합니다.
<meta> 요소의 content 속성은 HTML 문서에 메타 정보를 설정하는 데 사용됩니다. 예를 들어 name 속성과 함께 사용하면 페이지 설명(description)이나 키워드(keywords) 같은 정보를 지정할 수 있으며, 이러한 메타 정보는 검색 엔진 최적화(SEO)나 소셜 미디어 공유 시 중요하게 활용됩니다.
content 속성 기본 문법
content 속성의 기본적인 작성 형식은 다음과 같습니다.
<meta content="메타정보">
여기서 따옴표 안의 값이 실제로 설정되는 메타 정보입니다. 참고로 name 또는 http-equiv 속성이 정의되어 있다면 content 속성은 반드시 함께 작성해야 합니다.
content 속성 사용 예제
다음은 <meta> 요소의 content 속성을 실제로 적용한 예제입니다. head 영역에서 문서의 설명을 설정하고 있습니다.
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Learn for free">
</head>
<body>
<h2>Tutorials</h2>
<p>Programming tutorials for free:</p>
<ol>
<li>Java</li>
<li>C++</li>
<li>C</li>
<li>C#</li>
</ol>
</body>
</html>
실행 결과
위 코드를 브라우저에서 실행하면 아래와 같은 결과가 출력됩니다. head 영역의 meta 태그는 화면에 직접 표시되지 않지만, 검색 엔진이 페이지를 이해할 때 활용하는 중요한 정보가 됩니다.
