css3 - 如何在PC網(wǎng)頁上預(yù)覽手機(jī)網(wǎng)站樣式?
問題描述
在線編輯器里的寫的一些html5+css3效果和手機(jī)瀏覽器上看到的不一致,反復(fù)調(diào)整測試很麻煩,有沒有方法可以在PC網(wǎng)頁上直接預(yù)覽手機(jī)網(wǎng)站樣式,非Google Chrome F12手機(jī)模擬器,要網(wǎng)頁上的。
問題解答
回答1:如果題主是說,發(fā)給客戶,讓客戶隨便拿個(gè)瀏覽器,而且讓瀏覽器全屏,不用知道任何瀏覽器本身的使用手段也能看手機(jī)效果的話,推薦按照這個(gè)思路:
把想要讓客戶預(yù)覽的手機(jī)網(wǎng)頁發(fā)布到公網(wǎng),即使只是測試版。ngrok這樣的工具可以直接把你本地的localhost給發(fā)布到公網(wǎng)。一般得到類似http://cc007c0b.ngriok.io這樣的地址。
用responsinator這個(gè)站點(diǎn),帶上你的手機(jī)網(wǎng)站的地址(最后得到http://www.responsinator.com/?url=cc007c0b.ngriok.io這樣的),把這個(gè)地址發(fā)給客戶看就好了。
回答2:現(xiàn)在最方便的就是在Chrome上使用手機(jī)瀏覽模式,或者firefox上的響應(yīng)式設(shè)計(jì)模式
回答3:F12已足夠
回答4:Google Chrome手機(jī)模擬器看到的樣式基本上一致。為什么不用?
回答5:不是我用,是客戶用,客戶需要無論任何瀏覽器都能看到和手機(jī)瀏覽器里看到的效果一致。客戶不一定安裝Google Chrome。
回答6:叫客戶裝chrome。。不裝不給他玩。
相關(guān)文章:
1. 跟著課件一模一樣的操作使用tp6,出現(xiàn)了錯(cuò)誤2. PHP類屬性聲明?3. css - 手機(jī)瀏覽器的兼容問題,微信和其它下載的瀏覽器打開沒有問題,谷歌也測試過,就是手機(jī)自帶的瀏覽器有問題。4. 前端 - 應(yīng)該先從angularJS , vue.js , react 這些框架中的哪個(gè)開始入手?5. css - div外層有一圈白色6. css - 這些字體是怎么弄的?7. css3 - IE678兼容last-child的方法 請教8. transform - css3 translate 的水平垂直居中問題求解9. android - 關(guān)于百度定位的問題10. 微信小程序支持跳轉(zhuǎn)到外部鏈接網(wǎng)頁嗎
