HTML5의 의미 태그 소개

HTML5 표준에는 페이지 의미를 추가하기 위해 여러 가지 새로운 태그가 추가되었습니다. 이러한 태그에는 기사, 섹션, 탐색 및 측면 등이 포함됩니다. 대부분의 다른 태그와 달리 브라우저는 추가 표시 논리를 추가하지 않고 이러한 태그를 해석하고 렌더링할 때 이를 일반 p 블록 수준 요소로만 처리합니다. 즉, 이러한 태그는 의미를 추가하는 데만 사용됩니다. 웹 개발자에게 이러한 태그 사용의 실제 의미는 주로 검색 엔진 최적화와 페이지의 유용성(접근성) 향상이라는 두 가지 사항입니다.

요소 분류 측면에서 기사, 섹션, 탐색 및 옆을 "섹션화 콘텐츠"라고 합니다.

article

article 요소를 사용할 수 있습니다. 페이지를 나타냅니다. 독립적인 콘텐츠의 특정 부분입니다. 이 콘텐츠는 기사, 포럼의 게시물/댓글, 블로그, 대화형 컨트롤 등이 될 수 있습니다. 기사 태그는 중첩될 수 있습니다. 이렇게 하려면 하위 기사 요소가 상위 기사 요소와 논리적으로 연결되어야 합니다. 예를 들어, 웹 개발자는 블로그의 텍스트와 댓글을 상위 기사 요소로 사용하고 각 댓글을 하위 기사 요소로 사용할 수 있습니다.

메인 요소는 기사 요소 안에 나타날 수 없습니다. 메인 요소는 페이지의 메인 콘텐츠를 의미하며, 메인 요소가 있는 경우 기사 요소는 메인 요소의 하위 요소로 존재합니다.

섹션

섹션 요소는 페이지 또는 웹 애플리케이션의 일부를 의미합니다. 각 섹션은 서로 다른 "테마" 또는 "톤"을 가져야 합니다. 테마"/"톤"은 일반적으로 섹션 요소 내에 제목 요소(h1-h6)를 배치하여 정의됩니다.

섹션을 p로 사용하는 것은 실수입니다. 페이지에 표시할 수 있는 콘텐츠를 제외하고 섹션의 하위 요소는 다른 역할(스타일, 동작, 보조 태그 등)을 가정해서는 안 됩니다. ).

nav

nav 요소는 주로 페이지에 탐색 링크를 포함하는 데 사용되므로 nav에 ul 요소 또는 ol 요소를 직접 포함하는 것이 매우 일반적인 관행입니다. 요소. 그럼에도 불구하고 nav에는 ul 또는 ol 요소가 포함될 필요가 없습니다. 예를 들어 nav 요소에는 기사 단락(p 태그)이 포함될 수 있고 기사 단락에는 일부 링크(태그)가 포함될 수 있습니다.

article 요소와 마찬가지로 nav 요소 안에 main 요소가 나타날 수 없습니다.

aside

aside 요소는 일반적으로 페이지의 사이드바를 나타내는 데 사용되지만 이 요소는 의미상으로 태그를 구문 분석하고 렌더링할 때 "사이드바"만을 나타냅니다. , 이는 일반 p 블록 수준 요소로만 처리됩니다. 사이드바 효과를 실제로 얻으려면 웹 개발자가 이를 달성하기 위해 자체 CSS를 작성해야 합니다.

위의 HTML5 시맨틱 태그 소개는 모두 편집자가 공유한 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(m.sbmmt.com)를 참고해주세요!