Blogtrottr
♣梅問題‧教學網【Minwt】♣
分享關於Photoshop教學|商品攝影|網頁教學|Wordpress教學|iPhone教學| Flash教學|jQuery教學...等 
Chrome外掛-「網設必備」的三套RWD自適應網頁檢測工具
Mar 7th 2014, 01:30, by admin

梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
  好容易將自適應的網頁製作完成時,接著就是開始任意的拖拉視窗,檢測網頁是否能在各解析下正常的顯示,由於大部分只能利用目測的方式,大約抓一下目前是在平板大小,還是手機大小,其實Chrome瀏覽器中,已有許多RWD自適應網頁的檢測外掛了,只要安裝完畢後,點一下立即就可將視窗,縮放到指定的裝置下,如此一來就可知道,在各裝置下版型是否有跑位,雖然說在Chrome瀏覽器的外掛中,有相當多的RWD外掛套件,在經梅干一一的實用後,發現到這三套RWD自適應的檢測工具相當好用,因此身為網頁設計人員,絕不容錯過喔!

Mobile/RWD Tester:
外掛名稱:Mobile/RWD Tester
適用平台:Google Chrome
外掛網址:Chrome Store

當安裝完畢後,點一下Mobile/RWD Tester圖示,就會出現各種行裝置的類型。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
點一下後,就會跳出另一個新視窗,並將視窗縮放到指定的範圍裡。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
Responsive Inspector:
外掛名稱:Responsive Inspector
適用平台:Google Chrome
外掛網址:Chrome Store

這套檢測工具比較特別,它會自動偵測網頁是否有製作RWD自適應網頁,以及可切換的解析有那些。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
點一下視窗立即就會切換到,指定的範圍裡。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
Responsive Site View:
外掛名稱:Responsive Site View
適用平台:Google Chrome
外掛網址:Chrome Store

這一套有別於前面二套,除了可切換到指定的裝置外,還可旋轉視窗,像是橫向顯示或直向顯示。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
這套比較值得一題是,所有的變化,都會嵌在它的工作視窗裡。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具
除了可從下拉選單中,更改裝置的類型外,也可設定瀏覽的方向。
梅問題-Chrome外掛-網設必備的三套RWD自適應網頁檢測工具


引用網址: ※如有發現掉圖或檔案無法下載,請由回應區留言告知,將會盡速處理!謝謝。
※本站採用CC授權請勿全文轉貼本站文章,歡迎「部份引用」與介紹,並註明出處,謝謝。

This entry passed through the Full-Text RSS service — if this is your content and you're reading it on someone else's site, please read the FAQ at fivefilters.org/content-only/faq.php#publishers.

You are receiving this email because you subscribed to this feed at blogtrottr.com.

If you no longer wish to receive these emails, you can unsubscribe from this feed, or manage all your subscriptions
arrow
arrow
    全站熱搜
    創作者介紹
    創作者 qhhybnwxggadn 的頭像
    qhhybnwxggadn

    線上遊戲排行榜2013/2014,進擊的巨人線上看,candy crush saga外掛,正妹寫真三圍

    qhhybnwxggadn 發表在 痞客邦 留言(0) 人氣()