>  기사  >  웹 프론트엔드  >  HTML5 - 새로운 의미 요소의 사용 및 호환성

HTML5 - 새로운 의미 요소의 사용 및 호환성

黄舟
黄舟원래의
2017-02-27 15:55:331732검색

1. 새로운 의미 요소:

HTML5는 웹 페이지의 다양한 부분을 명확하게 하는 새로운 의미 요소를 제공합니다.


  • 1aa9e5d373740b65a0cc8f0a02150c53: 는 문서의 헤더 영역을 설명합니다. , 는 문서의 헤더 영역을 정의하는 데 사용됩니다. 콘텐츠 소개 표시 영역

  • c787b9a589a3ece771e842a6176cf8e9: 내비게이션 링크를 정의하는 부분입니다.

  • 2f8332c8dcfd5c7dec030a070bf652c3: 은 문서의 섹션(섹션, 섹션)을 정의합니다. 문서의 장, 머리글, 바닥글 또는 기타 부분과 같은 섹션에는 일반적으로 콘텐츠 그룹과 제목이 포함됩니다.

  • 23c3de37f2f9ebcb477c4a90aac6fffd: 은 독립적인 콘텐츠를 정의합니다.

  • 15221ee8cba27fc1d7a26c47a001eb9b: 페이지의 기본 영역(예: 사이드바) 외부에 있는 콘텐츠를 정의합니다.

  • a7e92aa379a95c24a947f9b436d5f4f4: 태그는 독립적인 스트림 콘텐츠(이미지, 차트, 사진, 코드 등)를 지정합니다.

  • 614eb9dc63b3fb809437a716aa228d24: 은 a7e92aa379a95c24a947f9b436d5f4f4 요소의 제목 을 정의합니다.

  • c37f8231a37e88427e62669260f0074d: 는 문서의 하단 영역을 설명합니다. , 바닥글에는 일반적으로 작성자와 저작권이 포함됩니다. 문서의 정보, 링크된 이용 약관, 연락처 정보 등 .

웹 페이지에서 이러한 새로운 의미 태그 요소의 위치는 다음과 같습니다.


2. 새로운 요소에 대한 브라우저 호환성 문제:

이러한 블록과 요소가 모든 버전의 브라우저에 적용되려면 다음을 수행해야 합니다. 스타일에 추가 테이블 파일의 속성을 설정합니다(다음 스타일 코드를 사용하면 이전 브라우저가 이 장에 소개된 블록 수준 요소를 지원할 수 있습니다):


header, section, footer, aside, nav, article, figure
{ 
    display: block; 
}


IE8 및 이전 IE 버전은 이러한 요소에서 CSS 효과를 렌더링할 수 없으므로 1aa9e5d373740b65a0cc8f0a02150c53, 2f8332c8dcfd5c7dec030a070bf652c3, c37f8231a37e88427e62669260f0074d, 15221ee8cba27fc1d7a26c47a001eb9b를 사용할 수 없습니다. , c787b9a589a3ece771e842a6176cf8e9 , 23c3de37f2f9ebcb477c4a90aac6fffd, a7e92aa379a95c24a947f9b436d5f4f4 또는 기타 HTML5 요소를 사용하여 HTML5 Shiv를 사용하여 이 문제를 해결할 수 있습니다.

<!--[if lt IE 9]>
<script src="html5shiv.js"></script>
<![endif]-->


위 내용은 HTML5-new 시맨틱 요소의 사용 및 호환성에 대한 자세한 내용은 PHP 중국어 홈페이지(www.php.php)를 참고하시기 바랍니다. CN)!


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.