網站適配無疑已經成為了傳統pc網站快速向wap網站轉型的很佳解決方案。網站適配得借助相關的技術才能實現。我們今天來說一下手機屏幕的適配原理，看看重慶網站建設公司創新互聯為您帶來的分析。

隨著手機屏幕的不斷的增大，同時也遇到一些用戶手機屏幕還是處于240*320這種屏幕的大小，當然也存著在一些不規則的屏幕分辨率心寸大小。對于很多設計人員來說，不同的手機屏幕需要多套圖片才能保證手機客戶端在不同的屏幕上實現匹配。針對手機客戶端在不同屏幕下的實現進行規劃，制定出一個能夠計算出具體控件位置的填充區算法，這個是前期對于不同的手機屏幕的匹配做出的一個界面適配算法。

首先認清幾個手機屏幕區域(先從240*320與320*240說起)：

1.填充區

CONTAINER：在這個標準中，使用填充區概念對界面進行控制，整個頁面由大小不一的填充區組成，不同的填充區有在適應屏幕時，有不同的縮放規則。

2.SCREEN

SCREEN：根據填充區，每個分辨率下的可見區域尺寸，其尺寸等于某型號手機的屏幕分辨率。如在n73下，SCREEN的參數為240*320。

3.基準屏幕

針對橫屏和豎屏的屏幕，采用兩套不同的基準屏幕，豎基準屏幕240*320和橫基準屏320*240，兩種基準屏幕之間可以進行切換。

豎屏240*320合適屏幕縮放：

豎屏的屏幕縮放基于240*320大小，可以縮放到480*640等屏幕的大小。滿足iPhone以及安卓等用戶的需要。

豎屏的字體比例縮放：當控件適配不同屏幕時，控件需要根據字體的縮放而進行縮放。

遵循的原則——頭尾原則

在常規界面的適配過程中，遵從先頭尾，后中間的原則，先確定頭部高度，再確定尾部高度，然后根據屏幕高度來和頭尾高度確定內容填充區高度，完成整個界面布局的調整。控件寬度以比例縮放原則為主。

縮放原則：

界面在適配于不同界面時，一般采用不同的縮放規則，不同的填充區根據需要分別采用字體縮放和比例縮放。

效果中可以看出，采用寬度自適應效果進行縮放的話，配合上、下滾動條可以實現較好的顯示效果，同時保證能夠清晰查看圖片內容。因此，借鑒圖片的寬度自適應，將界面看作是一張圖片來處理，通過不同屏幕分辨率的寬度比作為調整壁紙對界面進行保持比例的縮放。

網站標題：手機屏幕適配原理
URL標題：http://m.2m8n56k.cn/news31/115131.html

成都網站建設公司_創新互聯，為您提供全網營銷推廣、面包屑導航、網站營銷、網站內鏈、Google、微信小程序

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：[email protected]。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯