Trang chủ
CSS
Ví dụ CSS MQ
Dùng thử: Ví dụ về sử dụng truy vấn phương tiện
Chạy ❯
Nhận trang web của
riêng
bạn
×
Thay đổi định hướng
Lưu mã
Thay đổi chủ đề, Tối/Sáng
Đi tới Không gian
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width,initial-scale=1"> <style> div.example { Background-color: lightgrey; phần đệm: 20px; } @media screen và (min-width: 600px) { div.example { font-size: 80px; } } @media screen và (max-width: 600px) { div.example { font-size: 30px; } } </style> </head> <body> <h2>Thay đổi kích thước phông chữ của một phần tử trên các kích thước màn hình khác nhau</h2> <div class="example">Ví dụ DIV.</div> <p>Khi chiều rộng của trình duyệt rộng từ 600px trở xuống, đặt cỡ chữ DIV thành 30px. Khi nó có kích thước 601px hoặc rộng hơn, hãy đặt cỡ chữ thành 80px. Thay đổi kích thước cửa sổ trình duyệt để xem hiệu ứng.</p> </body> </html>