HTML5에서는 많은 새로운 요소가 추가되고 폐지되는 동시에 많은 속성도 추가되고 폐지됩니다.
새로운 속성
1. 양식 관련 속성
입력(유형=텍스트), 선택, 텍스트 영역 및 버튼에 대한 자동 초점 속성을 지정합니다. 속성을 지정하여 화면이 열릴 때 요소가 자동으로 포커스를 얻을 수 있도록 합니다. 입력(type=text) 및 텍스트 영역에 대한 자리 표시자 속성을 지정하면 사용자에게 입력하라는 메시지를 표시하고 사용자가 입력할 수 있는 콘텐츠가 무엇인지 알 수 있습니다. 입력, 출력, 선택, 텍스트 영역, 버튼 및 필드 세트에 대한 양식 속성을 지정합니다. 이는 그것이 속한 양식을 선언한 다음 양식을 놓치지 않고 페이지의 아무 곳에나 배치합니다. 입력(type=text) 및 textarea에 필요한 속성을 지정합니다. 이 속성은 사용자가 제출할 때 확인하고 요소에 입력 콘텐츠가 있어야 함을 나타냅니다. 입력 태그에 자동 완성, 최소, 최대, 다중, 패턴 및 단계와 같은 몇 가지 새로운 속성을 추가합니다. datalist 요소와 함께 사용되는 목록 속성도 있습니다. datalist 요소는 autocomplete 속성과 함께 사용됩니다. 다중 속성을 사용하면 업로드 중에 여러 파일을 한 번에 업로드할 수 있습니다. 패턴 속성은 실제로 정규식인 입력 필드의 패턴을 확인하는 데 사용됩니다. step 속성은 입력 필드의 유효한 숫자 간격을 지정합니다(step="3"인 경우 유효한 숫자는 -3, 0, 3, 6 등이어야 함). step 속성은 max와 함께 사용할 수 있습니다. 유효한 값 범위를 생성하는 최소 속성입니다. 입력 및 버튼 요소에 formaction, formenctype, formmethod, formnovalidate 및 formtarget 속성을 추가합니다. 사용자는 양식 요소의 action, enctype, method, novalidate 및 target 속성을 재정의합니다. 해당 하위 요소를 비활성화된 상태로 설정하려면 fieldset 요소에 비활성화된 특성을 추가하세요. 입력, 버튼, 폼에 novalidate 속성을 추가하면 제출 시 수행했던 해당 검사를 취소할 수 있으며, 무조건 폼을 제출할 수 있습니다.2. 링크 관련 속성
및 영역에 미디어 속성을 추가합니다. 대상 URL이 최적화되는 미디어/장치 유형을 지정합니다. 이 속성은 대상 URL이 특정 장치(예: iPhone), 음성 또는 인쇄 매체용으로 설계되었음을 지정하는 데 사용됩니다. 이 속성은 여러 값을 허용할 수 있습니다. href 속성이 있는 경우에만 사용할 수 있습니다. 지역에 herflang 및 rel 속성을 추가합니다. hreflang 속성은 링크된 문서의 텍스트 언어를 지정합니다. 이 속성은 href 속성이 설정된 경우에만 사용할 수 있습니다. 참고: 이 속성은 순전히 권고 사항입니다. rel 속성은 현재 문서와 연결된 문서/리소스 간의 관계를 지정합니다. rel 속성은 href 속성을 사용할 때만 사용할 수 있습니다. 링크에 크기 속성을 추가합니다. 크기 속성은 연결된 리소스의 크기를 지정합니다. 이 속성은 연결된 리소스가 아이콘(rel="icon")인 경우에만 사용할 수 있습니다. 이 속성은 여러 값을 허용할 수 있습니다. 값은 공백으로 구분됩니다. 기본 요소에 target 속성을 추가하는 것은 주로 a 요소와의 일관성을 유지하기 위한 것입니다.3. 기타 속성
목록이 역순으로 표시되도록 지정하는 reversed 속성을 ol에 추가합니다. 메타에 charset 속성을 추가하고 메뉴에 유형 및 레이블 속성을 추가합니다. label은 메뉴에 대한 코스웨어 레이블을 정의하고 type 속성을 사용하면 메뉴가 컨텍스트 메뉴, 도구 모음 및 목록의 세 가지 형식으로 나타날 수 있습니다. 스타일에 범위 속성을 추가합니다. 전체 문서 대신 문서의 특정 부분에 대한 스타일을 정의할 수 있습니다. "scoped" 속성을 사용하는 경우 지정된 스타일은 스타일 요소의 상위 요소와 해당 하위 요소에만 적용될 수 있습니다. 스크립트가 비동기적으로 실행되는지 여부를 정의하는 스크립트의 속성을 추가하거나 뺍니다. async 속성은 외부 스크립트에서만 작동합니다(src 속성을 사용하는 경우에만) 외부 스크립트를 실행하는 방법에는 여러 가지가 있습니다. async="async"인 경우: 페이지가 계속되는 동안 스크립트는 페이지의 나머지 부분에 대해 비동기적으로 실행됩니다. 구문 분석을 수행하면 스크립트가 실행됩니다) async가 사용되지 않고 defer="defer"인 경우: 페이지 구문 분석이 완료되면 스크립트가 실행됩니다. async나 defer가 사용되지 않는 경우: 브라우저가 실행되기 직전에 스크립트를 읽고 실행합니다. URL을 정의하고 이 URL에 있는 문서의 캐시 정보를 설명하기 위해 오프라인 웹 애플리케이션을 개발할 때 API와 함께 사용되는 매니페스트를 추가합니다. iframe, sandbox, Seamless, srcdoc에 속성을 추가합니다. 페이지 보안을 강화하고 신뢰할 수 없는 웹 페이지가 특정 작업을 수행하지 못하도록 방지하는 데 사용됩니다.폐지된 속성
HTML4의 일부 속성은 HTML5에서 더 이상 사용되지 않지만 다른 속성이나 다른 방법으로 대체됩니다.
HTML 4에서 사용되는 속성 | 이 속성을 사용하는 요소 | HTML 5의 대안 |
개정 | 링크, | 상대 |
문자세트 | 링크, | 링크된 리소스의 HTTP Content-type 헤더 요소 사용 |
모양, 좌표 | 아 | 요소 대신 영역 요소 사용 |
긴 설명 | img, iframe | a 요소를 사용하여 주요 설명에 연결 |
대상 | 링크 | 중복 속성, 생략 |
nohref | 지역 | 중복 속성, 생략 |
프로필 | 머리 | 중복 속성, 생략 |
버전 | html | 중복 속성, 생략 |
이름 | 이미지 | 아이디 |
계획 | 메타 | 특정 양식 필드에만 구성표 사용 |
아카이브, chlassid, codebose, codetype, 선언, 대기 | 객체 | 플러그인을 호출하려면 데이터 및 typc 속성 클래스를 사용하세요. 매개변수를 설정하기 위해 이러한 속성을 사용해야 하는 경우 param 속성 | 을 사용하세요.
값 유형, 유형 | 매개변수 | 이름 및 값 속성을 사용하고 MIME 유형을 선언하지 마세요. |
축, abbr | 일, 일 | 명확하고 간결한 텍스트로 시작하여 자세한 텍스트가 이어지는 형식을 사용하세요.더 자세한 내용을 보려면 title 속성을 사용하여 셀 내용을 더 짧게 만들 수 있습니다 |
범위 | td | 링크된 리소스의 HTTP Content-type 헤더 요소 사용 |
정렬 | 캡션, 입력, 범례, div, h1, h2, h3, h4, h5, h6, p | 대신 CSS 스타일시트를 사용하세요 |
alink, 링크, 텍스트, vlink, 배경, bgcolor | 몸 | 대신 CSS 스타일시트를 사용하세요 |
정렬, bgcolor, 테두리, 셀 패딩, 셀 간격, 프레임, 규칙, 너비 | 테이블 | 대신 CSS 스타일시트를 사용하세요 |
align, char, charoff, height, nowrap, valign | tbody, thead, tfoot | 대신 CSS 스타일시트를 사용하세요 |
align, bgcolor, char, charoff, height, nowrap, valign, width | 일, 일 | 대신 CSS 스타일시트를 사용하세요 |
align, bgcolor, char, charoff, valign | tr | 대신 CSS 스타일시트를 사용하세요 |
정렬, char, charoff, valign, 너비 | 열, 열그룹 | 대신 CSS 스타일시트를 사용하세요 |
정렬, 테두리, hspace, vspace | 객체 | 대신 CSS 스타일시트를 사용하세요 |
지우기 | br | 대신 CSS 스타일시트를 사용하세요 |
compace, type | 올, 울, 리 | 대신 CSS 스타일시트를 사용하세요 |
컴팩트 | dl | 대신 CSS 스타일시트를 사용하세요 |
컴팩트 | 메뉴 | 대신 CSS 스타일시트를 사용하세요 |
너비 | 사전 | 대신 CSS 스타일시트를 사용하세요 |
정렬, hspace, vspace | 이미지 | 대신 CSS 스타일시트를 사용하세요 |
정렬, noshade, 크기, 너비 | 시간 | 대신 CSS 스타일시트를 사용하세요 |
정렬, 프레임 테두리, 스크롤, 여백 높이, 여백 너비 | 아이프레임 | 대신 CSS 스타일시트를 사용하세요 |
자동 제출 | 메뉴 |