（接上一節(jié)內(nèi)容）

4.屏幕分辨率

屏幕分辨簡單點說就是用戶顯示器的分辨率，深一點說，屏幕分辨率指的是用戶使用的設(shè)備瀏覽您的Web頁面時的顯示屏幕的分辨率，比如說智能手機瀏覽器、移動電腦瀏覽器、平板電腦瀏覽器和桌面瀏覽器的分辨率。Responsive設(shè)計利用Media Queries屬性針對瀏覽器使用的分辨率來適配對應(yīng)的CSS樣式。因此屏幕分辨率在Responsive設(shè)計中是一個很重要的東西，因為只有知道Web頁面要在哪種分辨率下顯示何種效果，才能調(diào)用對應(yīng)的樣式。

5.主要斷點

主要斷點，在Web開發(fā)中是一個新詞，但對于Responsive設(shè)計中是一個很重要的一部分。簡單的描述就是，設(shè)備寬度的臨界點。在Media Queries中，其中媒體特性“min-width”和“max-width”對應(yīng)的屬性值就是響應(yīng)式設(shè)計中的斷點值。簡單點說，就是使用主要斷點和次要斷點，創(chuàng)建媒體查詢的條件。而每個斷點會對應(yīng)調(diào)用一個樣式文件（或者樣式代碼），如下圖所示：

上圖的style.css樣式文件運用在Web頁面中，但這個樣式文件包括了所有風(fēng)格的樣式代碼，也就是說所有設(shè)備下顯示的風(fēng)格都通過這個樣式文件下載下來。當(dāng)然，在實際中還可以使用另一種方法，也就是在不同的斷點加載不同的樣式文件，如下圖所示。

上圖主要顯示的是主要斷點，主要斷點加載的不同樣式文件直接將影響Web的效果。除了主要斷點之外，為了滿足更多效果時，還可以在這個基礎(chǔ)上添次要斷點。不過主要斷點和次要斷點增加之后，需要維護的樣式也相應(yīng)的增加，成本也相對應(yīng)的增加。因此在實際使用中，需要根據(jù)自身產(chǎn)品需求，決定斷點。

綜合下來，設(shè)置斷點應(yīng)把握三個要點：滿足主要的斷點；有可能的話添加一些別的斷點；設(shè)置高于1024的桌面斷點。