Truy vấn phương tiện dành cho các quy tắc kiểu khác nhau cho các thiết bị có kích thước khác nhau như điện thoại di động, máy tính để bàn, v.v.
Bạn có thể thử chạy mã sau để triển khai các truy vấn phương tiện với CSS3 -
Ví dụ
<html>
<head>
<style>
body {
background-color: lightpink;
}
@media screen and (max-width: 420px) {
body {
background-color: lightblue;
}
}
</style>
</head>
<body>
<p>If screen size is less than 420px, then it will show lightblue color,
or else it will show light pink color</p>
</body>
</html>