device-width

Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

Note: Để truy vấn chiều rộng của khung nhìn (viewport), các nhà phát triển nên sử dụng tính năng media width thay thế.

Tính năng media device-width trong CSS có thể được dùng để kiểm tra chiều rộng bề mặt hiển thị của thiết bị đầu ra.

Cú pháp

Tính năng device-width được chỉ định dưới dạng giá trị <length>. Đây là tính năng phạm vi, nghĩa là bạn cũng có thể dùng các biến thể có tiền tố min-device-widthmax-device-width để truy vấn giá trị nhỏ nhất và lớn nhất tương ứng.

Ví dụ

Áp dụng stylesheet đặc biệt cho các thiết bị có chiều rộng nhỏ hơn 800 pixel

html
<link
  rel="stylesheet"
  media="screen and (max-device-width: 799px)"
  href="https://cdn.example.com/narrow-styles.css" />

Đặc tả

Specification
Media Queries Level 4
# device-width

Tương thích trình duyệt

Xem thêm