Hỗ trợ HTML5 trên các trình duyệt
Bạn có thể dạy cho các trình duyệt biết cách xử lý HTML5 đúng cách.
Trình duyệt hỗ trợ HTML5
HTML5 được hỗ trợ trên hầu hết các trình duyệt hiện đại. Các trình duyệt, dù mới hay cũ, đều tự động xử lý các phần tử mà nó không biết như một phần tử nội dòng. Do đó, bạn cần “dạy” cho nó biết cách xử lý các phần tử HTML mới. Ngay cả IE6 (trên Windows XP 2001) cũng có thể “dạy” được.
Định nghĩa các phần tử cú pháp thành phần tử khối
HTML định nghĩa 8 phần tử cú pháp mới, tất cả đều là ở cấp độ khối. Để đảm bảo hiển thị đúng trên trình duyệt cũ, bạn có thể đặt đặc tính display cho các phần tử này về dạng khối.
header, section, footer, aside, nav, main, article, figure {
display: block;
}
Thêm phần tử mới vào HTML
Bạn còn có thể thêm phần tử mới vào trang HTML, như ví dụ dưới đây thêm phần tử có tên <myHero> và định nghĩa kiểu cách cho nó.
<!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>Tiêu đề</h1>
<myHero>Phần tử myHero</myHero>
</body>
</html>
Cần dùng lệnh JavaScript document.createElement(“myHero”) để tạo phần tử mới trên IE9 và các bản trước đó.
Vấn đề với Internet Explorer 8
Có thể dùng giải pháp trên cho tất cả các phần tử HTML5 mới. Nhưng IE8 và các bản trước đó lại không cho phép tạo kiểu cách trên các phần tử nó không biết.
Vì vậy Sjoerd Visscher đã tạo ra HTML5Shiv. Đây là giải pháp thay thế JavaScript, cho phép tạo kiểu cách cho phần tử HTML5 trên các bản IE 8 trở về trước.
Cú pháp của HTML5Shiv
HTML5Shiv được đặt trong thẻ <head>, là tập tin JavaScript được tham chiếu tới trong thẻ <script>. Bạn nên dùng HTML5Shiv khi dùng các phần tử HTML5 mới như <article>, <section>, <aside>, <nav>, <footer>.
Cú pháp HTML5Shiv
<head>
<!--[if lt IE 9]>
<script src="/js/html5shiv.js"></script>
<![endif]-->
</head>
Ví dụ về HTML5Shiv
Nếu không muốn tải và lưu trữ HTML5Shiv trên trang của mình, bạn có thể tham chiếu phiên bản trên trang CDN. Kịch bản HTML5Shiv phải được đặt trong phần tử <head>.
<!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>Trang công nghệ</h1>
<article><h2>Quản trị mạng</h2>
<p>Quản trị mạng là trang công nghệ, cung cấp các hướng dẫn, thủ thuật và tin tức công nghệ mới nhất.</p>
</article>
</section>
</body>
</html>
Link tải HTML5Shiv https://github.com/aFarkas/html5shiv hoặc tham khảo bản CDN https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js
Bài trước: Giới thiệu về HTML5
Bài sau: Các phần tử mới trong HTML5
Bạn nên đọc
Theo Nghị định 147/2024/ND-CP, bạn cần xác thực tài khoản trước khi sử dụng tính năng này. Chúng tôi sẽ gửi mã xác thực qua SMS hoặc Zalo tới số điện thoại mà bạn nhập dưới đây:


Cũ vẫn chất
-
Cách ẩn trò chơi bạn đang chơi trên Discord
Hôm qua -
Cách gỡ huy hiệu Threads khỏi trang cá nhân Instagram
Hôm qua -
Gét gô là gì? Thử thách 6 ngày 6 đêm là gì?
Hôm qua 6 -
Cách cấu hình địa chỉ IP tĩnh trên Ubuntu 22.04 LTS và 22.10
Hôm qua -
TeraBox
-
Cách thiết lập các ảnh nền khác nhau trên mỗi màn hình Windows 10/11
Hôm qua -
Hướng dẫn đổi trình đọc PDF mặc định trên Windows 10
Hôm qua -
Code Race Clicker mới nhất và cách nhập code
Hôm qua -
Code Tiểu Yêu Tầm Đạo mới nhất
Hôm qua -
Cách tắt kiểm tra chính tả trong Word
Hôm qua 1