Các cách làm trang web hiển thị không lỗi trên trình duyệt IE cũ

Trang web hiển thị không như mong muốn trên các trình duyệt IE cũ (IE 6,7,8) chủ yếu là do chúng ko hỗ trợ HTML5 và CSS3

1. Đối với CSS3, có cách dễ nhất là làm cho IE cũ hiểu đc CSS3 thông qua công cụ CSS3 PIE. Download tại: đây (tải bản 1.0.0), rồi copy file PIE.htc vào thư mục chứa website của bạn. Sau đó tiến hành sửa code rất đơn giản như sau, với mỗi phần có sử dụng thuộc tính CSS3 như border-radius, box-shadow, linear-gradient (để biết thuộc tính nào là của CSS3 có thể tham khảo tại: đây), bạn thêm vào thuộc tính behavior: url(PIE.htc); vào cuối cùng. Trong đó url là đường dẫn tới file PIE.htc tùy theo bạn. Ví dụ sau khi thêm thì ta đc như sau:

2. Nhận dạng trình duyệt IE và áp dụng các code riêng cho nó. Đoạn code dưới đây nói rằng nếu sử dụng trình duyệt IE thì file ie.css và ie.js sẽ đc load, còn các trình duyệt khác thì không:

Trong file js này ta có thể thực hiện thay đổi đoạn code có sẵn trong file html bằng các hàm jQuery như .html, .append, .appendTo để bằng các đoạn code ko dùng HTML5 để IE đọc đc. Có thể nhận diện riêng biệt từng phiên bản IE cụ thể hoặc nhóm các phiên bản, tham khảo tại: đây (lưu ý: cách này chỉ có tác dụng với IE9 trở xuống)

3. Về việc các thẻ img có chứa link bị 1 cái viền màu xanh (tím), ta chỉ cần thêm thuộc tính vào thẻ img như sau:

là đc. Thuộc tính này ko ảnh hưởng gì đến thuộc tính CSS border mà bạn đã quy định cho các thẻ img. Nếu đã có rất nhiều thẻ img, ta có thể thêm thuộc tính hàng loạt cho tất cả thẻ img bằng đoạn mã jQuery dưới đây:

4. Cách xem trang web trên IE cũ khi máy tính ko có:
Muốn biết trang web của mình hiển thị như thế nào trên IE cũ như IE 6,7,8,9 trong khi máy tính lại ko có (dùng win mới nên đc cài sẵn IE 10,11 hoặc đã update), ta chỉ cần mở IE hiện tại (ở đây là 11), nhấn F12, chọn mục Emulation rồi chỉnh như trong hình dưới đây là đc (như hình dưới là đang xem trên IE7).

ie

Have fun! :))