隨著設備的增多,屏幕尺寸也越來越多,了解柵格化的計算方法會對各種屏幕大小之間的轉換起到基礎作用。當然,作為小白,我對于柵格化也有很多不理解之處,如果有有用的資料可以評論區互相交流。
1. 什么是柵格化?
百度百科的解釋是:柵(shān)格化,是PS中的一個專業術語,柵格即像素,柵格化即將矢量圖形轉化為位圖(柵格圖像)。最基礎的柵格化算法將多邊形表示的三維場景渲染到二維表面。
通俗的理解,柵格化就是按照某種規則將圖形像素化。
網頁的柵格化就是以規則的網格陣列來指導和規范網頁中的版面布局以及信息分布。
2. 如何計算柵格?
柵格化公式
在網頁設計中,我們把寬度為“W”的頁面分割成n個網格單元“a”,每個單元與單元之間的間隙設為“i”,此時我們把“a+i”定義“A”。他們之間的關系如下:
W =(a×n)+(n-1)i
由于a+i=A,
可得:(A×n) – i = W
3. 如何應用?
根據網頁應用的用戶屬性確定最常見屏幕尺寸,從而確定版心寬度(常見為990px或1200px),再根據版心和想要柵格的網格數n推算出公式中的柵格寬度a和間隙i。按照算出的各種參數畫出柵格,在柵格的基礎上進行頁面設計。
當然,柵格并不是萬能的,如果想要有很完美的適配,還需要根據經驗多嘗試和分析。
王旋子同學