HTML 5.1 - 14가지 새로운 기능 및 사용 샘플 코드에 대한 자세한 설명(그림)
HTML5는 인터넷 커뮤니티 전체에 표준을 제공하는 조직인 W3C(World Wide Web Consortium)에 속해 있으며, 그 결과 만들어진 프로토콜은 전 세계에서 사용할 수 있습니다. 2016년 11월, W3C는 2년 만에 처음으로 마이너 업데이트인 HTML 5 표준을 업데이트했습니다. 원래 HTML 5.1에 제안된 많은 기능은 디자인 결함과 브라우저 공급업체의 지원 부족으로 인해 제거되었습니다.
HTML 5.1에는 일부 요소와 기능이 개선되었지만 여전히 소규모 업데이트입니다. 새로운 요소 중 일부에는
W3C는 2017년 말에 출시될 예정인 HTML 5.2 초안 개발을 시작했습니다. 우리가 여기서 소개할 내용은 버전 5.1에 도입된 새로운 기능과 개선 사항입니다. 이러한 기능을 활용하기 위해 JavaScript를 사용할 필요는 없습니다. 모든 브라우저가 이러한 기능을 지원하는 것은 아니므로 프로덕션에서 사용하기 전에 브라우저 지원을 확인하는 것이 좋습니다.
14. 피싱공격 예방
target ='_blank'를 사용하는 대부분의 사람들은 흥미로운 사실을 모릅니다. 새로 열린 탭이 window.opener.location을 일부 피싱 페이지로 변경할 수 있다는 것입니다. 열려 있는 페이지에서 사용자를 대신하여 일부 악성 JavaScript 코드를 실행합니다. 사용자는 자신이 여는 페이지가 안전하다고 믿기 때문에 의심의 여지가 없습니다.
이 문제를 완전히 제거하기 위해 HTML 5.1은 브라우저 컨텍스트를 분리하여 rel="noopener" 속성의 사용을 표준화했습니다. rel="noopener"는 및 태그에 사용할 수 있습니다.
아아아아13. 이미지 제목을 유연하게 처리
12. 맞춤법 검사
맞춤법 검사는 값이 빈 문자열, true 또는 false일 수 있는 열거형 속성입니다. 상태를 true로 지정하면 해당 요소의 철자와 문법이 검사됩니다.
element.forceSpellCheck()는 사용자가 해당 요소에 입력을 집중하지 않은 경우에도 사용자 에이전트가 텍스트 요소에 대한 검사된 철자 및 문법 오류를 보고하도록 강제합니다.
아아아아11. 빈 옵션
새로운 버전의 HTML을 사용하면 빈
10. 프레임 전체화면 지원
Frame용으로 개발된 부울 변수인 Allowfullscreen 속성을 사용하면 requestFullscreen() 메서드를 사용하여 콘텐츠를 전체 화면으로 표시할 수 있는지 여부를 제어할 수 있습니다. 예를 들어 YouTube 플레이어에 삽입된 iframe을 사용해 보겠습니다. 플레이어가 비디오를 전체 화면으로 표시할 수 있도록 하려면 allowedfullscreen 속성을 설정해야 합니다.
아아아아9. 머리글과 바닥글 삽입
HTML5.1을 사용하면 머리글과 바닥글을 다른 머리글 안에 삽입할 수 있습니다. 단락 콘텐츠 내에 머리글이나 바닥글이 포함된 경우 머리글 요소에 머리글이나 바닥글을 추가할 수 있습니다. 이 기능은 의미 있는 단락 요소에
아래 코드에서
8. 이미지 제로 너비
새 버전의 HTML에서는 너비가 0인 이미지를 추가할 수 있습니다. 이 기능은 이미지를 사용자에게 표시할 필요가 없을 때 사용할 수 있습니다. img 요소가 이미지 표시 이외의 용도로 사용되는 경우(예: 페이지 조회수를 계산하는 서비스의 일부) 너비 및 높이 속성에 0 값을 사용합니다. 너비가 0인 이미지의 경우 빈 속성을 사용하는 것이 좋습니다.
아아아아7. 확인서
新的 reportValidity() 方法允许你校验一个表单和重置结果,并且在浏览器适合位置向用户报告错误。用户代理可以报告一个以上的限制规则,假如单一元素同时遇到多个问题。对于这种情况,“密码”输入为必填内容但没有填,将会标识为错误。
<h2>Form validation</h2> <p>Enter details</p> <form> <label> Mandatory input <input type="password" name="password" required /> </label> <button type="submit">Submit</button> </form> <script> document.querySelector('form').reportValidity() </script>
6. 浏览器的上下文菜单
在 HTML 5.1 中, 你可以使用

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

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

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

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

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

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

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

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