標籤：響應 螢幕 color htm 金錢 情況下 pos 情況 lan
基本概念
響應式開發在沒有媒體查詢前，也可以通過js來實現，但是人們基本不會考慮，特別繁瑣。在出現了媒體查詢，才開始逐漸推廣響應式。實際開發中，在時間與金錢充足的情況下還是別做響應式，影響效能，維護麻煩。
基本使用
1、螢幕大於等於480px，使用括弧裡的
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> @media screen and (min-width: 480px) { body { background-color: black; } } </style></head><body></body></html>
2、螢幕小於等於1000px，使用括弧裡的
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> @media screen and (max-width: 1000px) { body { background-color: black; } } </style></head><body></body></html>
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> @media screen and (max-width: 1000px) { .header{ display: none; } } .header{ width: 100%; height: 50px; border: 1px solid #304115; } </style></head><body><div class="header"></div></body></html>
移動web——媒體查詢
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
