Trình Duyệt Hỗ Trợ HTML5

Có thể bạn quan tâm

Trình duyệt hỗ trợ HTML5

HTML5 được hỗ trợ trong tất cả các trình duyệt hiện đại. Ngoài ra, tất cả các trình duyệt cũ và mới, việc xử lý hoàn là các phần không được công nhận như phần tử nội tuyến là tự động.

Do đó, bạn có thể “chỉnh sửa” các trình duyệt cũ hơn để xử lý các phần tử HTML “không xác định”. Bạn thậm chí có thể chỉnh IE6 (Windows XP 2001) cách xử lý các phần tử HTML không xác định.

Xác định phần tử ngữ nghĩa như phần tử Block

HTML5 định nghĩa 8 yếu tố ngữ nghĩa mới. Tất cả đều là những yếu tố cấp độ khối. Để đảm bảo hành vi đúng trong các trình duyệt cũ hơn, bạn có thể đặt thuộc tính hiển thị CSS cho các phần tử HTML này để chặn:

header, section, footer, aside, nav, main, article, figure { display: block; }

Thêm phần tử mới vào HTML

Bạn cũng có thể thêm các phần tử mới vào một trang HTML với thủ thuật trình duyệt. Ví dụ này thêm một phần tử mới gọi là <myHero> vào một trang HTML, và định nghĩa một style:

<!DOCTYPE html> <html> <head> <script>document.createElement(“myHero”)</script> <style> myHero { display: block; background-color: #dddddd; padding: 50px; font-size: 30px; } </style> </head> <body>

<h1>A Heading</h1> <myHero>My Hero Element</myHero>

</body> </html>

Các tài liệu JavaScript document.createElement (“myHero”) là cần thiết để tạo ra một phần tử mới trong phiên bản IE 9 và trước đó.

Vấn đề với Internet Explorer 8

Bạn có thể sử dụng giải pháp được mô tả ở trên cho tất cả các phần tử HTML5 mới. Tuy nhiên, IE8 (và phiên bản trước đó) không cho phép tạo style của các phần tử không xác định.

Rất may, Sjoerd Visscher đã tạo ra HTML5Shiv. HTML5Shiv là một cách giải quyết JavaScript để cho phép tạo kiểu của các phần tử HTML5 trong các phiên bản trước của Internet Explorer 9.

Bạn sẽ yêu cầu HTML5shiv cung cấp tính tương thích cho trình duyệt IE 9 trở về trước.

Cú pháp cho HTML5Shiv

HTML5Shiv được đặt trong thẻ <head>. HTML5Shiv là một tệp javascript được tham chiếu trong thẻ <script>.

Bạn nên sử dụng HTML5Shiv khi bạn sử dụng các phần tử HTML5 mới như: <article>, <section>, <aside>, <nav>, <footer>. Cú pháp:

<head> <!–[if lt IE 9]> <script src=”/js/html5shiv.js”></script> <![endif]–> </head>

Ví dụ về HTML5Shiv

Nếu bạn không muốn tải xuống và lưu trữ HTML5Shiv trên trang web của mình, bạn có thể tham khảo phiên bản được tìm thấy trên trang web CDN.

Tập lệnh HTML5Shiv phải được đặt trong phần tử <head>, sau bất kỳ biểu định kiểu nào:

<!DOCTYPE html> <html> <head> <meta charset=”UTF-8″> <!–[if lt IE 9]> <script src=”https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js”></script> <![endif]–> </head> <body>

<section>

<h1>Famous Cities</h1>

<article> <h2>London</h2> <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p> </article>

<article> <h2>Paris</h2> <p>Paris is the capital and most populous city of France.</p> </article>

<article> <h2>Tokyo</h2> <p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.</p> </article>

</section>

</body> </html>

Tham khảo thêm 2 khóa học hữu ích do giảng viên quốc tế trường FPT Arena giảng dạy:

Khóa học lập trình frontend cơ bản : Bootstrap 4, Jquery, CSS3, HTML5
Học lập trình Frontend nâng cao qua project thực tế

Từ khóa » Trình Duyệt Html5

Trình Duyệt Hỗ Trợ HTML5