代碼規(guī)范
一.移動端的相關(guān)開發(fā)技術(shù)
-
1.原生開發(fā)
- 安卓
- iOS
- WinPhone
-
2.Hybrid開發(fā)(混合開發(fā))
- 原生App+ webView界面中的H5
-
- M站(移動web)
- 展示在手機瀏覽器或者App內(nèi)的網(wǎng)頁中(引導(dǎo)App下載)
對比
二.視覺方面
- 點(Points)
一開始,所有圖紙的坐標以點為單位。
點是抽象單位陷嘴,它們只在這個數(shù)學(xué)坐標空間中有意義。
- 渲染像素(Rendered Pixels)
基于點的繪圖渲染成像素忍法。這個過程被稱為光柵化。
點坐標 * 比例因子 = 像素坐標榕吼。 比例因子越大渲染出來越高清.
比例因子: window.devicePixelRatio
1 CSS pixels = (devicePixelRatio)^2 device pixels
- 物理像素(Physical Pixels)
一般情況下, 物理像素 == 渲染像素饿序。但是有例外(比如plus機型),設(shè)備屏幕分辨率 < 渲染像素分辨率.
在顯示圖像之前,必須對下采樣(調(diào)整大懈肌)以降低像素分辨率原探。
- 物理設(shè)備(Physical Device)
PPI(Pixels Per Inch): 圖像的采樣率 (在圖像中,每英寸所包含的像素數(shù)目)
DPI (Dots per inch):打印分辨率 (每英寸所能打印的點數(shù)顽素,即打印精度)
三.長度單位
- px
最常用的單位
- em
以父元素為參照的字體大小,也可以做長度單位
- rem
以當(dāng)前頁面html元素(根元素)為參照的字體大小(默認是16px),也可以做長度單位
- 長度單位demo
<p style="font-size: 14px;">最大的爹標簽p
<!--<h1 style="font-weight: normal">h1標簽</h1>-->
<span style="font-size: 1em;">兒子0</span>
<span style="font-size: 2em;">兒子1</span>
<span style="font-size: 28px;">兒子2</span>
<span style="font-size: 16px;">兒子3</span>
<span style="font-size: 1rem;">兒子4</span>
<span style="font-size: 24px;">兒子5</span>
</p>
<script>
/* 總結(jié):
* 1. em: em = parentNode.style.font-size
* 2. rem: rem = document.documentElement.style.font-size
* 3. html中fz的大小可以直接設(shè)置 npx or n%
* */
</script>