電腦上如何查看h5響應式網站在手機下的效果

響應式，html5，微官網這些詞語相信不少人在這兩年裏看到了很多，由於這幾年這些確實是實在的火了一把，從切圖網近兩年承接的項目數據來看，html5手機端以及響應式項目也已經超越pc項目數量。隨着手機終端的使用增多，爲移動互聯網的推動提供了硬件基礎，不少人開始在移動互聯網下掘金，而移動互聯網掘金與傳統互聯網不一樣的最大地方在於，這個時候，你不單單是有一個網站這麼簡單，這個網站還須要在pc，手機，平板下都可以很是的好看。

若是你已經有一個響應式網站，那麼如何測試在手機下的效果呢，用手機直接打開測試固然能夠，當時讓你要測試比較多款的手機，那麼這個方法顯然是行不通的。因此咱們須要瞭解響應式的原理，才採用一些有效的方法來測試。響應式網站會響應的最新核心技術原理是，經過css3多媒體查詢技術（css3 media query）來定義不一樣寬度下的樣式。例如

因此它的實際原理是根據設備的寬度來呈現不一樣的樣式，在pc上，咱們只須要簡單的拖動瀏覽器窗口的大小就能夠看到響應式的變化。在實際響應式開發中，咱們用的工具是firebug，或者chrome插件，若是非開發者，目前也有一些用於測試的在線網站例如跨屏測 ，能夠方便你來測試，而它們的實現原理也均是採用控制瀏覽器寬度這個原理實現的。