社群
學習
工具庫
AI工具
休閒
搜尋
繁体中文
首頁 web前端 css教學 手機螢幕尺寸測試－手機的實際顯示頁面的寬度_經驗交流

手機螢幕尺寸測試－手機的實際顯示頁面的寬度_經驗交流

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
May 16, 2016 pm 12:03 PM
寬度 智慧型手機 頁面

手機站開發遇到一些問題，設計頁面使用多大的尺寸？為此做了一些研究，除iphone特別一些外，目前市面上的安卓系統的實際顯示頁面的寬度，都是360px。

手機型號 豎屏寬度
iphone 5 320px
iphone 6 375px
iphone 6 plus 414px
nexus 4 384px
android(大多數) 360px

前兩年，安卓的解析度多數還是240px 或320px，現在是360px，為了向下相容，向上也相容，最終將360px 定為設計的尺寸，後期可以使用css3 media queries即媒體查詢特性做進一步的兼容，兼容其他設備，以及做一些設備的橫屏的兼容。

附：螢幕尺寸測試的js程式碼，如下

<!DOCTYPE html>
<html>
<head>
 <title>屏幕尺寸测试</title>
 <meta http-equiv="Content-type" content="text/html; charset=utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 <meta name="apple-mobile-web-app-capable" content="yes" />
 <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
</head>

<body style="padding:0px;margin:0px;" scroll="no">
	<script language="javascript">
		var s = "";
		s += "网页可见区域宽："+ document.body.clientWidth;
		s += "<br>网页可见区域高："+ document.body.clientHeight;
		s += "<br>网页可见区域宽："+ document.body.offsetWidth +" (包括边线和滚动条的宽)";
		s += "<br>网页可见区域高："+ document.body.offsetHeight +" (包括边线的宽)";
		s += "<br>网页正文全文宽："+ document.body.scrollWidth;
		s += "<br>网页正文全文高："+ document.body.scrollHeight;
		s += "<br>网页被卷去的高："+ document.body.scrollTop;
		s += "<br>网页被卷去的左："+ document.body.scrollLeft;
		s += "<br>网页正文部分上："+ window.screenTop;
		s += "<br>网页正文部分左："+ window.screenLeft;
		s += "<br>屏幕分辨率的高："+ window.screen.height;
		s += "<br>屏幕分辨率的宽："+ window.screen.width;
		s += "<br>屏幕可用工作区高度："+ window.screen.availHeight;
		s += "<br>屏幕可用工作区宽度："+ window.screen.availWidth;
		s += "<br>你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";
		s += "<br>你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
		document.write(s);
	</script>
</body>
</html>
登入後複製

本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序，用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

顯示更多

熱門文章

R.E.P.O.能量晶體解釋及其做什麼（黃色晶體）
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
刺客信條陰影：貝殼謎語解決方案
2 週前 By DDD
R.E.P.O.如果您聽不到任何人，如何修復音頻
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25：如何解鎖Myrise中的所有內容
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
顯示更多

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版，非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

顯示更多

熱門話題

gmail信箱登陸入口在哪裡
7460
15
CakePHP 教程
1376
52
steam的賬戶名稱是什麼格式
77
11
win11激活密鑰永久
44
19
NYT連接提示和答案
17
17
顯示更多
Related knowledge
OPPO A3x 手機發表：搭載聯發科天璣 6300，4+128GB 版本 1199 元 OPPO A3x 手機發表：搭載聯發科天璣 6300，4+128GB 版本 1199 元 Jul 30, 2024 am 01:27 AM

7月29日消息，除1,799元的OPPOA3活力版手機之外，OPPO還推出了一款A3x（PKD130），提供星光白、暗夜紫、雲羽粉三種配色。根據@完美編排數位的說法，OPPOA3x似乎是一款定位線下的機型，跟活力版區別主要在於後置鏡頭換為32+2MP雙攝。總結定價如下：4+128GB版本1199元6+128GB版本1499元8+256GB版本1999元1.搭載聯發科天璣6300處理器配備LPDDR4X內存和UFS2.2閃存支援2TB存儲拓展採用6.67英寸“陽光屏” ，擁有1600×720解析度、1

三星 Galaxy S25 Ultra 手機曝料：6.86 吋、橫向螢幕佔 94.1% 三星 Galaxy S25 Ultra 手機曝料：6.86 吋、橫向螢幕佔 94.1% Aug 17, 2024 pm 01:49 PM

8月17日消息，消息源@i冰宇宙今天發布微博，表示蘋果iPhone16ProMax精確尺寸6.88英寸，GalaxyS25Ultra精確尺寸6.86英寸，兩者都可視為6.9英寸。訊息源表示三星GalaxyS25Ultra比S24Ultra更窄的機身，還有更寬的螢幕，橫向螢幕佔94.1％，而S24Ultra橫向螢​​幕佔比是91.5％。 fenye查詢該訊息來源相關微博，他也評論了最新曝光的iPhone16ProMax照片，認為接近微曲是錯誤的，該機然是直屏+2.5D玻璃。

「串聯OLED」被蘋果帶火了，比OLED強在哪裡？ 「串聯OLED」被蘋果帶火了，比OLED強在哪裡？ Aug 19, 2024 am 04:42 AM

雖然最近幾年的蘋果一直被詬病創新不足，但是蘋果也並不總是止步不前。至少在硬體設計上，在蘋果產品的高單價支援下，它的工程師可以輕鬆嘗試一些全新的技術，而不需要過多的考慮成本問題。例如iPadPro，身為蘋果最愛的「顯示技術」試驗田，iPadPro從2021年的miniLED到2024年的串聯OLED，一直走在便攜智慧型裝置的顯示技術前端。雖然iPadPro並非首款搭載miniLED螢幕的便攜式智慧型裝置（微星較蘋果早一年發布miniLED筆記型電腦），但是當你比較兩者的參數，你會很快意識到他們不是一個

海力士搶先展示UFS 4.1快閃記憶體：以V9 TLC NAND顆粒打造 海力士搶先展示UFS 4.1快閃記憶體：以V9 TLC NAND顆粒打造 Aug 09, 2024 pm 03:33 PM

8月9日消息，在FMS2024峰會上，SK海力士展示了其最新的儲存產品，包括尚未正式發布規範的UFS4.1通用快閃記憶體。根據JEDEC固態技術協會官網訊息，目前公佈的最新UFS規範是2022年8月的UFS4.0，其理論介面速度高達46.4Gbps，預計UFS4.1將在傳輸速率上實現進一步的提升。 1.海力士展示了512GB和1TBUFS4.1通用快閃記憶體產品，基於321層V91TbTLCNAND快閃記憶體。 SK海力士也展出了3.2GbpsV92TbQLC和3.6GbpsV9H1TbTLC顆粒。海力士展示了基於V7

8 月 1 日發布，小米 POCO M6 Plus 5G 手機以及 POCO Buds X1 耳機實物照曝光 8 月 1 日發布，小米 POCO M6 Plus 5G 手機以及 POCO Buds X1 耳機實物照曝光 Jul 30, 2024 pm 02:29 PM

7月30日消息，消息來源YogeshBrar昨天（7月29日）在X平台發布推文，分享了小米POCOM6Plus5G手機以及POCOBudsX1耳機的實體照片，兩款產品官宣將於8月1日發布。小米POCOM6Plus5G手機訊息源表示，小米POCOM6Plus5G手機將配6.8吋LCD螢幕，搭載高通驍龍4Gen2AE處理器，背面配1.08億像素攝像頭，5030mAh容量電池。先前報導，這款手機可選紫色、黑色、銀色三種配色，整體與標準版POCOM6手機大致相同，但LED閃光燈環相對更加突出。 POCOB

先發1.5K螢幕下攝影！努比亞Z70 Ultra來了：全球首款驍龍8 Gen4真全面螢幕手機 先發1.5K螢幕下攝影！努比亞Z70 Ultra來了：全球首款驍龍8 Gen4真全面螢幕手機 Aug 19, 2024 pm 03:47 PM

8月19日消息，努比亞自Z50Ultra發布以來，一直秉承著真全面屏的設計，並且一直在高像素屏下前攝領域不斷探索。今日，據數位部落客智慧皮卡丘爆料稱，今年下半年即將發布的努比亞Z70Ultra將首發1.5K螢幕下攝影技術，是迄今為止業界分辨率最高的UDC方案。據悉，目前中興旗下的屏下前攝方案已推進到第六代。最新的屏下前攝方案在努比亞Z60Ultra、紅魔鬼9SPro系列中皆有所應有。螢幕解析度為2480x1116，介於1080P和1.5K解析度之間。這次努比亞將透過突破現有解析度的限制，將在業界

蘋果華為都想做的無按鍵手機，被小米先做出來了？ 蘋果華為都想做的無按鍵手機，被小米先做出來了？ Aug 29, 2024 pm 03:33 PM

根據Smartprix的爆料稱，小米正在研發一台代號為「朱雀」的無按鍵手機。這份爆料稱，這台代號朱雀的手機將秉承一體化的理念設計，使用屏下攝像頭，並搭載高通驍龍8gen4處理器，如果計劃沒有變動，我們很可能在2025年看到它的到來。看到這個消息，我恍惚間以為自己回到了2019年——那時小米發布了小米MIXAlpha概念機，環繞屏無按鍵設計相當驚艷。這是我第一次見識到無按鍵手機的魅力。想要一塊「魔力玻璃」，就要先把按鍵幹掉在《賈伯斯傳》中，賈伯斯曾經表達過：希望手機能夠像一塊「充滿魔力的玻璃」，

為本地運行谷歌 Gemini Nano AI 模型，三星 Galaxy S25 Ultra 手機被曝配 16GB 內存 為本地運行谷歌 Gemini Nano AI 模型，三星 Galaxy S25 Ultra 手機被曝配 16GB 內存 Jul 31, 2024 pm 05:55 PM

7月31日消息，消息源@i冰宇宙昨日（7月30日）在X平台發布推文，只寫道“16GByes！”，但從上下推文來判斷，應該是指三星GalaxyS25Ultra手機將會配備16GB的記憶體。三星手機記憶體容量更新三星曾在GalaxyS20Ultra和GalaxyS21Ultra手機上推出16GB記憶體。從GalaxyS22Ultra開始，包括最新旗艦GalaxyS24Ultra手機，三星手機的記憶體容量上限均為12GB。有消息稱，即將推出的三星GalaxyS25和GalaxyS25+將採用12GBLPDD

See all articles