html5가 5번째 개정판인가요?-프런트엔드 Q&A-php.cn

HTML5 개선

집

웹 프론트엔드

프런트엔드 Q&A

html5가 5번째 개정판인가요?

Jan 18, 2022 am 10:34 AM

html html5

html5는 다섯번째 수정입니다. HTML5는 HTML 표준의 다섯 번째 개정판입니다. 주요 목표는 인터넷의 의미를 인간과 기계가 더 잘 읽을 수 있도록 하는 동시에 HTML5의 구문을 더 잘 포함할 수 있도록 하는 것입니다. 이전 버전과 호환됩니다.

html5가 5번째 개정판인가요?

이 튜토리얼의 운영 환경: Windows 7 시스템, HTML5 버전, Dell G3 컴퓨터.

HTML5

HTML5는 HTML 표준의 다섯 번째 개정판입니다. 주요 목표는 인간과 기계가 더 잘 읽을 수 있도록 인터넷을 의미화하는 동시에 다양한 미디어 삽입에 대한 더 나은 지원을 제공하는 것입니다. HTML5 구문은 이전 버전과 호환됩니다. 현재 중국에서 흔히 통칭되는 H5에는 CSS3와 JavaScript가 포함되어 있습니다(엄밀히 말하면 이렇게 부르는 것은 적절하지 않지만 이렇게 부르는 것은 이미 잘못된 것입니다).

HTML5는 HTML의 최신 개정판으로, 2014년 10월 W3C(World Wide Web Consortium)에서 표준을 완성했습니다.

HTML5는 모바일 장치에서 멀티미디어를 지원하도록 설계되었습니다.

HTML5의 몇 가지 흥미로운 새 기능:

그림용 캔버스 요소.
미디어 재생을 위한 비디오 및 오디오 요소
로컬 오프라인 저장소에 대한 지원이 향상되었습니다.
기사, 바닥글, 헤더, 탐색, 섹션과 같은 새로운 특수 콘텐츠 요소입니다.
달력, 날짜, 시간, 이메일, URL, 검색과 같은 새로운 양식 컨트롤.

HTML5 개선

새 요소
새 속성
CSS3
비디오 및 오디오
2D /3D 드로잉
로컬 저장소
로컬 SQL 데이터
웹 애플리케이션

새로운 요소 및 속성

1. 의미 태그

의미 태그는 페이지의 내용을 이름별로 구조화하고 명확하게 만듭니다.

Tag

Description

문서의 헤드 영역을 정의합니다.

문서의 헤드 영역을 정의합니다. 지역

문서의 세부정보나 문서의 일부를 설명하는 데 사용됩니다

태그 세부정보 요소의 제목이 포함됩니다

정의 대화 상자(예: 프롬프트 상자)

2. 향상된 양식

　HTML5에는 여러 가지 새로운 양식 입력 유형이 있습니다. 이러한 새로운 기능은 더 나은 입력 제어 및 검증을 제공합니다.

DateTime-Local 이메일 입력 month월 선택number숫자 값 입력 필드range특정 범위 내의 숫자 값 입력 필드 검색 검색용 도메인 tel 입력 전화번호 필드 정의 time시간 선택 url URL 주소 입력 필드 week 주 및 연도 선택

입력 유형	Description
color	주로 색상을 선택하는데 사용됩니다
date	날짜 선택에서 날짜를 선택하세요 어
datetime 날짜(UTC 시간) 선택
날짜 및 시간(시간) 선택
이메일 주소가 포함된 도메인

HTML5에는 다음 양식 요소도 추가됩니다Description<datalist>목록 속성을 사용(&lt) ;input> 요소는 <datalist> 요소의 ID에 바인딩됩니다. <keygen>태그는 다음에 사용되는 키 쌍을 지정합니다. 양식 생성기 필드. <output>

	Form element

	신뢰할 수 있는 사용자 인증 방법을 제공합니다.
	은 계산 또는 스크립트 출력

과 같은 다양한 유형의 출력 🎜🎜에 사용됩니다.

HTML5 새 양식 속성

placehoder 속성을 사용하면 사용자가 값을 입력하기 전에 입력 필드에 짧은 프롬프트가 표시됩니다. 즉, 입력 상자의 일반적인 기본 프롬프트는 사용자가 입력한 후에 사라집니다.
필수 속성은 부울 속성입니다. 채워야 하는 입력 필드는 <input> 요소의 값을 확인하는 데 사용되는 정규식을 설명하는 패턴 속성을 비워둘 수 없습니다.
min 및 max 속성은 요소의 최소값과 최대값을 설정합니다.
step 속성은 입력 필드의 유효한 숫자 간격을 지정합니다.
height 및 width 속성은 이미지 유형의 <input> 태그의 이미지 높이 및 너비에 사용됩니다.
autofocus 속성은 부울 속성입니다. 페이지가 로드될 때 필드에 자동으로 초점이 맞춰지도록 지정합니다.
다중 속성은 부울 속성입니다. <input> 요소 내에서 여러 값을 선택할 수 있도록 지정합니다.

HTML5를 사용하면 웹페이지에서 동영상과 오디오를 간단하게 재생할 수 있습니다.

HTML5는 <audio> 요소의 제어 속성을 사용하여 재생, 일시 정지 및 볼륨 제어를 추가하는 오디오 파일 재생 표준을 제공합니다.

　<audio>와 </audio> 사이에는 브라우저가 지원하지 않는 <audio> 요소의 프롬프트 텍스트를 삽입해야 합니다.
　<audio> 요소는 여러 개의 <source> 요소를 사용할 수 있으며, 브라우저는 지원되는 첫 번째 오디오 파일을 사용합니다.
현재 <audio> 요소는 MP3, Wav 및 Ogg의 세 가지 오디오 형식 파일을 지원합니다.

HTML5는 비디오 요소를 통해 비디오를 포함하는 표준 방법을 지정합니다.

&lt;audio controls&gt;
  &lt;source src=&quot;horse.ogg&quot; type=&quot;audio/ogg&quot;&gt;
  &lt;source src=&quot;horse.mp3&quot; type=&quot;audio/mpeg&quot;&gt;
您的浏览器不支持 audio 元素。
&lt;/audio&gt;

로그인 후 복사

control은 비디오를 제어하기 위한 재생, 일시 정지 및 볼륨 제어 기능을 제공합니다. DOM 작업을 사용하여 play() 및 Pause() 메서드와 같은 비디오의 재생 및 일시 중지를 제어할 수도 있습니다.

동시에 비디오 요소는 비디오 크기를 제어하기 위한 너비 및 높이 속성도 제공합니다. 높이와 너비가 설정되면 페이지가 로드될 때 필요한 비디오 공간이 예약됩니다. 이러한 속성이 설정되지 않고 브라우저가 비디오의 크기를 알지 못하는 경우 브라우저는 로드 시 특정 공간을 예약할 수 없으며 페이지는 원본 비디오의 크기에 따라 변경됩니다.
과 태그 사이에 삽입된 콘텐츠는 video 요소를 지원하지 않는 브라우저에서 표시되도록 제공됩니다.
비디오 요소는 여러 소스 요소를 지원하며 다양한 비디오 파일을 연결할 수 있습니다. 브라우저는 처음으로 인식되는 형식(MP4, WebM 및 Ogg)을 사용합니다.