響應式網頁設計包含三個開發(fā)原則，要正常工作，所有這三個都需要實施：

1.流體網格

靈活的基于網格的布局是響應式設計的基石，它使用相對大小調整以使內容適合設備的屏幕大小。相反，CSS用于定位內容，這種方法基于百分比，與傳統(tǒng)的基于像素的設計原則不同。響應式設計遠離基于像素的方法，因為一個設備上的像素可能是另一個設備上的八個像素。通過將文本大小，寬度和邊距基于百分比，可以將固定大小轉換為相對于其顯示空間的大小。

2.媒體查詢

媒體查詢（也稱為斷點）可用于根據設備的功能應用不同的樣式，該網站會檢測您正在使用的設備類型或Web瀏覽器的大小，并正確顯示該頁面。要查看此操作，請將Web瀏覽器的窗口拉伸到不同的大小。注意頁面如何調整，功能可用于控制寬度，高度，大寬度，大高度，設備高度，方向，縱橫比等。

3.靈活的圖像和媒體

此功能允許您通過縮放或使用CSS溢出屬性，根據設備調整圖像和其他媒體的加載方式。

CSS中的縮放相對簡單，媒體元素的大寬度可以設置為100％，Web瀏覽器將根據容器縮小和擴展圖像。

下面是我公司為深圳市大器智能技術有限公司制作的官網截圖： http://www.daqixinxi.com.cn/