| <html> |
| <head> |
| <title>CSS3 media query test: Device-pixel ratio query. Using style element, @media css rule.</title> |
| <style type="text/css"> |
| @media screen and (-webkit-device-pixel-ratio: 1) { |
| p { color:green; } |
| } |
| |
| @media screen and (-webkit-device-pixel-ratio: 1.5) { |
| p { color:purple; } |
| } |
| |
| @media screen and (-webkit-device-pixel-ratio: 2) { |
| p { color:red; } |
| } |
| |
| </style> |
| </head> |
| |
| <body> |
| <p>This text should be green if the resolution scaling factor is 1.0, purple if the scaling factor is 1.5, |
| red if the scaling factor is 2.0, and black otherwise.</p> |
| </body> |
| </html> |
