怎么理解h5頁面的viewpoint-創(chuàng)新互聯(lián)

本篇內(nèi)容主要講解“怎么理解h5頁面的viewpoint”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“怎么理解h5頁面的viewpoint”吧!

創(chuàng)新互聯(lián)建站從2013年創(chuàng)立，先為夾江等服務(wù)建站，夾江等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為夾江企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

h6頁面的viewpoint

網(wǎng)上曾看到一個據(jù)說很有名的外國人，寫過一篇"三個viewpoint"的概念，但是看了，覺得似懂非懂，后來做了不少h6頁面，然后重新思考viewpoint到底是一種怎樣的控制移動端頁面的機(jī)制？于是我也覺得用"3個viewpoint"解釋比較好說，不過跟網(wǎng)上那個外國大佬的"三個viewport"可能會有不少區(qū)別。

viewpoint含義

第一個viewpoint，這里臨時命名為viewpoint1，就是手機(jī)硬件屏幕的水平像素數(shù)，比如iPhone6分辨率是750像素，那么這個viewpoint就是750

第二個viewpoint，這里臨時命名為viewpoint2，是設(shè)計稿尺寸寬度，通常是以一個用戶占有率比較高的手機(jī)分辨率為基準(zhǔn)，很多就是用iPhone6的750

第三個viewpoint，這里臨時命名為viewpoint3，就是手機(jī)瀏覽器畫布的寬度，它通常有一個遠(yuǎn)大于硬件分辨率的尺寸，比如980px，和主流PC端網(wǎng)頁的內(nèi)容主體寬度相當(dāng)。前端能夠直接施加影響的就只有viewpoint3這個了，實際上客觀存在的viewpoint可以說也只有這一個而已，可以在html中用標(biāo)簽meta設(shè)置，也可以JS動態(tài)設(shè)置。

最終用手機(jī)瀏覽h6頁面看到的效果，則是這三個viewpoint共同作用的。在沒有代碼干預(yù)的情況下，一般手機(jī)會有一個從viewpoint3到viewpoint1的縮放。手機(jī)為什么要設(shè)計這個機(jī)制呢？因為手機(jī)硬件屏幕小，但是又想讓手機(jī)能正常瀏覽PC的頁面。

為了更好的體驗，人們開始為手機(jī)定制web頁面，比如既然iphone6是750px，那我就做750px的頁面?？墒羌幢闳绱?，手機(jī)實際看到的頁面效果卻仍然是被縮放了，因為750px的頁面還是要放入到980px的viewpoint3中來顯示，而縮放是viewpoint3到viewpoint1的過程，和設(shè)計稿寬度，同時也是頁面實際寬度的viewpoint2是無關(guān)的。

到此，相信大家對“怎么理解h5頁面的viewpoint”有了更深的了解，不妨來實際操作一番吧！這里是創(chuàng)新互聯(lián)建站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)站欄目：怎么理解h5頁面的viewpoint-創(chuàng)新互聯(lián)
轉(zhuǎn)載注明：http://muchs.cn/article28/hiicp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供云服務(wù)器、企業(yè)網(wǎng)站制作、網(wǎng)站收錄、網(wǎng)站建設(shè)、建站公司、全網(wǎng)營銷推廣

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)