手機觸屏版頁面開發總結

2021-06-28 09:05:16 字數 1787 閱讀 9787

code:

複製**

主流解析度

android

:主流機型主要為 480x800, 480x854, 540x960, 720x1280, 800x1280 這五種。

(非主流機型還包括:240x320, 320x480, 640x960 這三種,其中兩種都與 iphone 一致。)

ios: 主流機型主要為 320x480, 640x960, 640x1136, 1024x768, 2048x1536, 這五種。

wp:主流機型主要為 480x800,720x1280, 768x1280 這三種

新增:iphone6:750*1334 iphone6s 1242*2208

使用相對單位

1、寬、高、填充、邊界均使用百分比

2、字型em/rem

em:相對父級

rem(root element)

:相對根父級

ps:字型單位一覽表(各大瀏覽器預設字型16px)

pixels

ems

percent

points

6px

0.375em

37.5%

5pt

7px

0.438em

43.8%

5pt

8px

0.5em

50%

6pt

9px

0.563em

56.3%

7pt

10px

0.625em

62.5%

8pt

11px

0.688em

68.8%

8pt

12px

0.75

75%

9pt

13px

0.813

81.3%

10pt

14px

0.875

87.5%

11pt

15px

0.938

93.8%

11pt

16px

1em

100%

12pt

17px

1.063em

106.3%

13pt

18px

1.125em

112.5%

14pt

19px

1.188em

118.8%

14pt

20px

1.25em

125%

15pt

21px

1.313em

131.3%

16pt

22px

1.375em

137.5%

17pt

23px

1.438em

143.8%

17pt

24px

1.5em

150%

18pt

合理使用box-flex,讓布局更簡單

相容性寫法:

你可以改變螢幕寬度檢視效果

flex1

我的寬度為父級的20%;

flex2

我的寬度為父級寬-(flex1+flex3);

flex3

我的寬度為父級的20%;

手機觸屏分類

通過moto xt800的開發,第一次接觸到另一種觸屏方式,所以網上找了下資料,發現與以往mobile手機開發中的不同之處 1 電阻式觸控螢幕 利用壓力感應進行控制。電阻觸控螢幕的主要部分是一塊與顯示器表面非常配合的電阻薄膜屏,這是一種多層的復合薄膜,它以一層玻璃或硬塑料平板作為基層,表面塗有一層透...

Discuz觸屏手機版顯示分類資訊的修改方法

discuz問題解決 dz x3.2 版本觸屏版不能顯示分類資訊,這個問題論壇中不少人也提到了,但是官方一直不解決。問題修復如下 1.開啟 template default touch forum viewthread.htm 找到 更改為 這樣就能正常顯示分類資訊了。繼續美化一下 找到 optio...

Unity 呼叫Android手機觸屏事件

一 下面先說經常用的三個事件 手指按下 手指移動 手指鬆開 1.手指按下if input touchcount 1 2.手指在螢幕上滑動 if input touchcount 1 if input touches 0 phase touchphase move 3.手指在螢幕上鬆開時 if inp...