이 기사의 내용은 html5의 새로운 구조, 즉 html 기본 구조와 비기본 구조에 대한 내용입니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
1 새로운 기본 구조 요소
1.1 기사 요소
는 외부에서 독립적으로 참조할 수 있는 문서, 페이지 또는 애플리케이션의 독립적이고 완전한 콘텐츠를 나타냅니다. (블로그나 신문이나 잡지의 기사 등)
1.2 섹션 요소
는 웹사이트나 애플리케이션 페이지의 콘텐츠를 섹션으로 나누는 데 사용됩니다. (기사 분할 등)
1.3 탐색 요소
는 페이지 탐색으로 사용할 수 있는 링크 그룹입니다. 탐색 요소는 현재 페이지의 다른 페이지 또는 다른 부분으로 연결됩니다.
1.4 side 요소
는 현재 페이지나 기사의 보조 정보 부분을 나타내는 데 사용됩니다. 여기에는 주요 내용과 다른 참조, 사이드바, 광고, 탐색 모음 및 기타 유사한 내용이 포함될 수 있습니다.
2 새로운 비주요 구조 요소
2.1 헤더 요소
는 안내 및 탐색 기능을 갖춘 구조 요소로 일반적으로 전체 페이지의 제목이나 페이지 내 콘텐츠 블록을 배치하는 데 사용됩니다. 또한 데이터 테이블, 검색 양식 또는 관련 로고 이미지와 같은 다른 콘텐츠를 포함할 수도 있습니다.
2.2 바닥글 요소
는 상위 콘텐츠 블록이나 루트 블록의 바닥글로 사용할 수 있습니다. 여기에는 일반적으로 저자, 관련 읽기 링크, 저작권 정보 등과 같은 서버의 관련 섹션에 대한 각주 정보가 포함됩니다.
2.3 주소 요소
는 문서 작성자 또는 문서 관리자의 이름, 문서 작성자 또는 문서 관리자의 웹사이트 링크, 이메일 주소, 실제 주소, 전화번호 등을 포함하여 문서의 연락처 정보를 표시하는 데 사용됩니다.
2.4 주요 요소
는 웹페이지의 주요 콘텐츠를 나타냅니다.
(1) 메인 콘텐츠 영역은 웹 페이지의 제목이나 애플리케이션 내 페이지의 주요 기능과 직접적으로 관련되거나 확장된 콘텐츠를 말합니다. 이 영역은 각 웹페이지에 고유한 콘텐츠여야 하며 전체 웹사이트의 탐색 모음, 저작권 정보, 웹사이트 로고, 공개 검색 양식 등과 같은 전체 웹사이트 내의 공통 콘텐츠를 포함할 수 없습니다.
(2) 각 웹페이지에는 하나의 주요 요소만 배치할 수 있습니다.
(3) 주요 요소는 기사, 옆글, 바닥글, 머리글 또는 탐색 요소 안에 배치될 수 없습니다.
3 새로운 구조 요소에 스타일 사용
(1) 많은 브라우저가 아직 H5의 새로운 구조 요소를 지원하지 않기 때문에 클라이언트가 사용하는 브라우저가 이러한 요소를 지원하는지 여부를 알 수 없으므로 CSS를 사용해야 합니다. 다음 문의 목적은 페이지에 사용된 H5의 새 요소가 아래와 같이 블록으로 표시된다는 것을 브라우저에 알리는 것입니다.
//追加block声明 article,aside,dialog,figure,footer,header,legend,nav,section,main{ display:block;} //正常使用样式 nav { float : left ; width:20% } article { float:right ; width:79% }
(2) IE8 및 이전 버전은 CSS 사용을 지원하지 않습니다. 아직 사용되지 않는 요소를 사용하려면 지원되는 구조 요소를 사용하려면 Javascript를 사용해야 합니다.
//脚本中创建元素 <script> document.createElement("header"); document.createElement("nav"); document.createElement("article"); document.createElement("footer"); document.createElement("main"); </script> <style> //正常使用样式 nav { float : left ; width:20% } article { float:right ; width:79% } </style>
관련 권장 사항:
위 내용은 html5의 새로운 구조: html 기본 구조 및 비기본 구조 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!