2011-05-18 28 views
5

Tôi có một loạt CSS được viết khiến trang web của tôi nhắm mục tiêu thiết bị di động trước, sau đó tôi sử dụng CSS Media Queries để tải một biểu định kiểu khác cho trình duyệt trên máy tính. Tôi làm điều này vì có rất nhiều trình duyệt di động không hiểu CSS Truy vấn phương tiện truyền thông và nhiều khả năng người dùng máy tính để bàn có trình duyệt hiện đại hỗ trợ điều này.CSS có điều kiện không được tải bởi IE7 và IE8

Tôi đã CSS sau đây mà làm việc trong tất cả các trình duyệt hiện đại (IE9, Chrome, Firefox 3.6+, Safari 4 + 5):

Sau đó tôi nhận ra rằng IE7 và IE8 không hỗ trợ CSS Truyền thông Queries nên ở trên sẽ không hoạt động. Vì vậy, tôi đã thêm một tuyên bố có điều kiện để nạp nó:

<link rel="Stylesheet" type="text/css" href="/css/mobile.css" media="all"/> 
<!-- [if lt IE 9]> 
<link rel="Stylesheet" type="text/css" href="/css/desktop.css" media="all" /> 
<! [endif] --> 
<link rel="Stylesheet" type="text/css" href="/css/desktop.css" media="only screen and (min-width: 640px)" /> 

Tuy nhiên, khi sử dụng IE Tester và Browsershots, tôi đã khẳng định rằng desktop.css không tải trong IE 7 và 8. Có vẻ như để được bỏ qua kiểu đó hoàn toàn.

Sau đó, tôi đã thử thay đổi câu lệnh có điều kiện thành <!-- [if IE 8]> nhưng điều đó không có hiệu lực.

Cuối cùng, tôi xóa bảng sao kê tình trạng hoàn toàn, kết quả là mã này:

<link rel="Stylesheet" type="text/css" href="/css/mobile.css" media="all"/> 
<link rel="Stylesheet" type="text/css" href="/css/desktop.css" media="all" /> 

này cuối cùng kết quả nỗ lực trong desktop.css tôi được nạp trong IE7 và IE8. Vì vậy, điều này chứng tỏ CSS là OK. Có vẻ như tuyên bố điều kiện của tôi không được kích hoạt.

Bất kỳ ý tưởng nào tôi đang làm sai?

+1

Không chắc chắn đây có phải là vấn đề hay không, nhưng hãy thử xóa khoảng trắng. '' -> '' – Shaz

Trả lời

8

Xóa dấu cách. Điều này vi phạm conditional syntax. Nếu không, IE sẽ xử lý nó như bình luận bình thường.

<!--[if IE 8]> 
... 
<![endif]--> 
+0

Xin cảm ơn, đây là vấn đề! (Lưu ý: Thực hiện thay đổi đối với nhận xét kết thúc của bạn, nó phải là ' ' – TMC

+0

Cảm ơn. Tôi đã cập nhật câu trả lời của mình. –

Các vấn đề liên quan