Cách sử dụng thuộc tính Media cho thiết bị cầm tay của thẻ HTML Link?

Question

Tôi hiện có các tài liệu sau trong tài liệu HTML của mình.

<link REL=StyleSheet HREF="/stylesheets/home.css" TYPE="text/css" MEDIA=screen> 
<link REL=StyleSheet HREF="/stylesheets/homedark.css" TYPE="text/css" MEDIA=handheld> 

Tuy nhiên, không có gì thay đổi trên thiết bị cầm tay (điện thoại Android của tôi). Có điều gì tôi đang làm sai, hay là nó không đơn giản như vậy?

Answer 1

Bạn sẽ cần phải sử dụng phương tiện truyền thông tiên tiến hơn truy vấn, chẳng hạn như những mục tiêu screen size

Vì vậy, một cái gì đó giống như

<link rel="stylesheet" href="/stylesheets/homedark.css" type="text/css" 
    media="screen and (max-device-width: 480px)"> 

Bên trong stylesheet của bạn, nó sẽ là một cái gì đó như thế này

@media only screen and (max-device-width: 480px) { 
    //Your styles here 
} 

http://www.w3.org/TR/css3-mediaqueries/

Simple JS phát hiện thiết bị có thể hữu ích:

if(navigator.userAgent.match(/Android/i) || 
    navigator.userAgent.match(/webOS/i) || 
    navigator.userAgent.match(/iPhone/i) || 
    navigator.userAgent.match(/iPod/i)){ 
    // link to stylesheet 
} 

Một việc khác còn tốt hơn để làm là sử dụng một số loại kết hợp ... phương tiện truyền thông truy vấn & phát hiện thiết bị/tính năng.

Đây là một cái nhìn tổng quan tốt: http://www.csskarma.com/presentations/cssla/slides/mobile_media_touch.pdf (Chú ý: file pdf)

Answer 2

Có thể điện thoại của bạn không tự coi mình là thiết bị cầm tay theo bất kỳ tiêu chí nào W3C sử dụng cho cụm từ đó. Các trình duyệt di động hiện đại không khác với trình duyệt toàn màn hình và không ở đâu gần như bị giới hạn như các trình duyệt WAP ban đầu (vô ích) trong điện thoại di động. Thường không có nhu cầu thực sự để tạo ra một loại "cầm tay" như trình duyệt điện thoại là tốt hơn tại quyết định những gì/làm thế nào để hiển thị nội dung hơn so với trang web được.

Answer 3

Theo w3schools các loại phương tiện cầm tay bị phản anyway. Bạn sẽ cần phải sử dụng các truy vấn phương tiện truyền thông để thực hiện những gì bạn muốn.

Rất tiếc, không có loại phương tiện nào cho "điện thoại". Khả năng quay số thực sự là sự khác biệt đặc biệt nhất.