在設計和製作自適應網頁的時候，我們經常會用到媒體查詢這一功能，可是過多的使用這個功能會增加我們的代碼量，增加了我們的維護成本，下面我們來一起看一下這幾個技巧，或許可以幫助你減少媒體查詢的使用。
1.使用百分比長度來取代固定長度。如果實在做不到這一點，也應該嘗試使用與視口相關的單位（vw、vh、vmin 和 vmax），它們的值解析爲視口寬度或高度的百分比。
2.當你需要在較大分辨率下得到固定寬度時，使用 max-width 而不是width，因爲它可以適應較小的分辨率，而無需使用媒體查詢。
3.給替換元素（比如 img、object、video、iframe 等）設置一個 max-width，值爲 100%。
4.假如背景圖片需要完整地鋪滿一個容器，不管容器的尺寸如何變化，background-size: cover 這個屬性都可以做到。但是，我們也要時刻牢記——帶寬並不是無限的，因此在移動網頁中通過 CSS 把一張大圖縮小顯示往往是不太明智的。
5.當圖片（或其他元素）以行列式進行佈局時，讓視口的寬度來決定列的數量。彈性盒佈局（即 Flexbox）或者 display: inline-block加上常規的文本折行行爲，都可以實現這一點。
6.在使用多列文本時，指定column-width（列寬）而不是指定column-count（列數），這樣它就可以在較小的屏幕上自動顯示爲單列布局。
以上是這幾個技巧需要多實踐去摸索，才能融會貫通，使之如臂，希望對大家有點幫助。