웹 프론트엔드 H5 튜토리얼 X/HTML5 및 XHTML2_html5 튜토리얼 팁

X/HTML5 및 XHTML2_html5 튜토리얼 팁

May 16, 2016 pm 03:51 PM
html xhtml 사용 요소 정의


XHTML 2의 진행 상황을 이해한 후, X/HTML 5의 진행 상황을 살펴보겠습니다.
X/HTML 5의 장점
챕터 요소 개념
X/HTML 5에는 웹 페이지를 장으로 나누는 새로운 요소가 도입되었습니다. 이러한 구성 요소는 검색 엔진과 접근성 도구가 페이지 콘텐츠를 더 잘 이해하는 데 도움이 됩니다. 이러한 새로운 요소를 사용하여 라벨을 더 읽기 쉽게 만드세요.
챕터별로 나누어진 콘텐츠 아이디어가 멋지네요! 하지만 왜 챕터 기술을 사용하는 것이 충분히 멋지지 않은지 살펴보세요.
대화 요소
대화 요소는 대화를 표현하는 데 사용됩니다. 화자를 정의하는 데 사용되는 dt 요소와 화자의 음성 내용을 나타내는 dd 요소가 포함됩니다. 예를 들어:

Costello

보세요, 1루수로 가야 하나요?

Abbott

물론이죠.

Costello

누가 먼저 뛸까요?

Abbott

맞습니다.

Costello

매달 1루수에게 돈을 지불하면 그 돈은 누가 받나요?

Abbott

1달러마다 입니다.


그림 요소
마스트헤드는 인쇄 출판물(교과서, 신문, 잡지 등)의 미디어 개체(사진, 삽화, 차트 등)에 자주 사용됩니다. 지금까지 웹 마크업 언어에는 이러한 효과를 낼 수 있는 구문이 없습니다. figrue 요소에는 이미지 헤더를 지정하는 데 사용할 수 있는 legend 하위 요소가 있습니다. 예를 들어:
XML/HTML 코드

제공: Media Inc., 2007
Photo: J. Smith

m요소
m 요소는 표시되거나 강조 표시된 텍스트 섹션을 나타냅니다. 이는 동적 웹 페이지에서 검색 키워드를 표시할 때 매우 유용합니다. 이때 페이지의 키워드는 m 요소를 사용하여 표시할 수 있습니다. 예를 들어, 사용자가 키워드 snow를 검색하면 웹 페이지는 다음 콘텐츠를 생성할 수 있습니다.
XML/HTML 코드

남자는 으로 만든 사람 같은 조각품입니다.


입력 요소가 강화되었습니다
이메일, URL, 데이터 관련, 시간 관련, 숫자 데이터 유형을 지원하도록 입력 요소 기능이 향상되었습니다. 이는 클라이언트 측에서 더 많은 확인 기능을 완료할 수 있음을 의미합니다.
공개 프로세스
X/HTML의 개발 프로세스는 XHTML 2보다 훨씬 더 개방적입니다. 누구나 X/HTML 5 창작 과정에 참여할 수 있습니다.
X/HTML 5 연고 속의 파리
챕터 요소 사용
챕터 요소를 활용하는 아이디어는 좋지만 X/HTML 5 애플리케이션에서는 다소 번거로운 것 같습니다. 일부 설명은 당신을 더 혼란스럽게 만들 수도 있습니다. 예를 들어:
Aside 요소는 페이지 콘텐츠의 일부를 나타내며, Aside 요소의 전후 콘텐츠와 관련이 있습니다. 이러한 구성 요소는 인쇄 기술의 사이드바에 자주 사용됩니다.
역할 속성이 있는 div 요소는 확장성이 뛰어나고 이해하기 더 쉽지 않나요?
언급된 또 다른 장 요소는 페이지의 다른 페이지에 대한 링크를 나타내는 데 사용되는 nav입니다. nav 요소가 정말 필요한가요? XHTML 2의 nl 요소는 이 작업을 더 잘 수행합니다.
HTML 4 및 XHTML 1의 결함은 향후 사양에도 여전히 존재할 것입니다.
X/HTML은 이전 버전 지원을 제공하려고 시도하므로 HTML 4 및 XHTML 1의 결함은 X/HTML 5에도 여전히 존재합니다. 사양은 이전 버전을 비워둘 필요가 없습니다. 대신 클라이언트 소프트웨어는 여러 사양을 지원하여 이전 버전과의 호환성을 제공해야 합니다.
X/HTML 5는 X/HTML 5 매뉴얼을 따르지 않습니다
X/HTML 5는 이전 버전인 HTML 4 및 XHTML 1과 호환되도록 설계되었습니다. 현재 big, 약어 u 및 tt는 이 사양의 일부가 아니지만 i 및 samll과 같은 다른 요소는 의미를 재정의했습니다. 예를 들어 i와 small은 HTML 4.01 사양에서 다음과 같이 정의됩니다.
i: 텍스트를 이탤릭체로 만듭니다.
작은: "작은" 글꼴로 텍스트를 렌더링합니다.
X/HTML 5에서 i와 small은 새로운 의미를 갖습니다.
i 요소는 분류 설계, 기술 용어, 외국어 관용어, 아이디어, 의견, 선박 이름 또는 기타 요구 사항 등 본문과 다른 텍스트 또는 단락을 다양한 방식으로 표현합니다. 인쇄 기술 텍스트를 이탤릭체로 렌더링합니다. .
작은 요소는 작은 활자체(저작권이나 기존 단점 등 법적 제약을 설명하는 문서의 일부)와 설명을 나타냅니다.
이는 i와 small의 의미를 재정의하여 HTML 4 및 XHTML 1과의 하위 호환성을 깨뜨립니다. 이전 버전과의 호환성은 HTML 4 문서를 렌더링할 때 HTML 5 사용자 에이전트(브라우저)가 HTML 4 사용자 에이전트와 일관성을 유지해야 함을 의미하기 때문입니다. 따라서 HTML 5가 이전 버전과의 호환성을 강조한다면 HTML 4에서 거의 의미가 없는 구조는 HTML 5에서도 거의 의미가 없습니다.
안돼요? 글꼴 요소가 계속 지원되나요?
예, 개발자가 WYSIWYG 편집기를 사용하는 경우 X/HTML 5는 여전히 글꼴 요소를 지원합니다. 이에 대한 정당성이 있습니까? WYSIWYG 편집자는 글꼴 사용을 피할 수 있나요?
WYSIWYG 서명
WYSIWYG 편집기를 사용하여 생성된 문서는 헤드 요소에 다음 WYSIWYG 서명을 포함해야 합니다.
XML/HTML 코드

또는:
XML/HTML 코드

이렇게 하는 이유는 무엇인가요? 일종의 수치심의 표시? 이 문서는 WYSIWYG 편집기로 생성되었기 때문에 브라우저에게 최악의 상황에 대비하라고 지시합니까? 그렇다면 WYSIWYG 도구를 사용하여 문서의 일부만 완성한다면 어떨까요?
사전 정의된 클래스 이름 지원
사전 정의된 클래스 이름은 X/HTML 5 사용자 에이전트에 예약된 의미론적 CSS 클래스 이름입니다. 다음 예에서 copyright는 미리 정의된 클래스 이름입니다.
XML/HTML 코드

미리 정의된 클래스 이름의 한 가지 문제점은 다음과 같이 작성하는 것이 의미가 없다는 것입니다.
XML/HTML 코드



이런 식으로만 쓰는 것이 의미가 있습니다.
XML/HTML 코드

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

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25 : Myrise에서 모든 것을 잠금 해제하는 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

HTML의 테이블 테두리 HTML의 테이블 테두리 Sep 04, 2024 pm 04:49 PM

HTML의 테이블 테두리 안내. 여기에서는 HTML의 테이블 테두리 예제를 사용하여 테이블 테두리를 정의하는 여러 가지 방법을 논의합니다.

HTML의 중첩 테이블 HTML의 중첩 테이블 Sep 04, 2024 pm 04:49 PM

HTML의 Nested Table에 대한 안내입니다. 여기에서는 각 예와 함께 테이블 내에 테이블을 만드는 방법을 설명합니다.

HTML 여백-왼쪽 HTML 여백-왼쪽 Sep 04, 2024 pm 04:48 PM

HTML 여백-왼쪽 안내. 여기에서는 HTML margin-left에 대한 간략한 개요와 코드 구현과 함께 예제를 논의합니다.

HTML 테이블 레이아웃 HTML 테이블 레이아웃 Sep 04, 2024 pm 04:54 PM

HTML 테이블 레이아웃 안내. 여기에서는 HTML 테이블 레이아웃의 값에 대해 예제 및 출력 n 세부 사항과 함께 논의합니다.

HTML 정렬 목록 HTML 정렬 목록 Sep 04, 2024 pm 04:43 PM

HTML 순서 목록에 대한 안내입니다. 여기서는 HTML Ordered 목록 및 유형에 대한 소개와 각각의 예에 대해서도 설명합니다.

HTML 입력 자리 표시자 HTML 입력 자리 표시자 Sep 04, 2024 pm 04:54 PM

HTML 입력 자리 표시자 안내. 여기서는 코드 및 출력과 함께 HTML 입력 자리 표시자의 예를 논의합니다.

HTML에서 텍스트 이동 HTML에서 텍스트 이동 Sep 04, 2024 pm 04:45 PM

HTML에서 텍스트 이동 안내. 여기서는 Marquee 태그가 구문과 함께 작동하는 방식과 구현할 예제에 대해 소개합니다.

HTML 온클릭 버튼 HTML 온클릭 버튼 Sep 04, 2024 pm 04:49 PM

HTML onclick 버튼에 대한 안내입니다. 여기에서는 각각의 소개, 작업, 예제 및 다양한 이벤트의 onclick 이벤트에 대해 설명합니다.

See all articles