網頁顯示實際寬度
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
<title>設備信息</title>
<style>
<?php
$ppi = 96;
if(strpos($_SERVER['HTTP_USER_AGENT'],' MI 5 Build') !== FALSE){
$ppi = 428;
}
?>
body{font-size:16px;}
span{display:inline-block;min-height:20px;background-color:#000000;}
</style>
<script>
var ppi = <?php echo $ppi;?>;
var rem = ppi/2.54/window.devicePixelRatio;
//rem模擬釐米
document.documentElement.style.fontSize = rem + 'px';
</script>
</head>
<body>
<?php
echo '通訊協議: ' . $_SERVER['SERVER_PROTOCOL'] ."<br/>\n";
echo '請求方法: ' . $_SERVER['REQUEST_METHOD'] ."<br/>\n";
echo 'User-Agent: ' . $_SERVER['HTTP_USER_AGENT'] ."<br/>\n";
echo '用戶IP: ' . $_SERVER['REMOTE_ADDR'] ."<br/>\n";
?>
<br/>
<script>
window.document.write('像素比例: ' + window.devicePixelRatio + '<br/>\n');
window.document.write('色彩深度: ' + window.screen.pixelDepth + '<br/>\n');
window.document.write('屏幕寬度: ' + window.screen.width + '<br/>\n');
window.document.write('屏幕高度: ' + window.screen.height + '<br/>\n');
window.document.write('屏幕可用寬度: ' + window.screen.availWidth + '<br/>\n');
window.document.write('屏幕可用高度: ' + window.screen.availHeight + '<br/>\n');
if (window.screen.deviceXDPI != undefined) {
window.document.write('屏幕水平DPI: ' + window.screen.deviceXDPI + '<br/>\n');
window.document.write('屏幕垂直DPI: ' + window.screen.deviceYDPI + '<br/>\n');
}
window.document.write('<br/>\n');
window.document.write('窗口寬度: ' + window.outerWidth + '<br/>\n');
window.document.write('窗口高度: ' + window.outerHeight + '<br/>\n');
window.document.write('窗內寬度: ' + window.innerWidth + '<br/>\n');
window.document.write('窗內高度: ' + window.innerHeight + '<br/>\n');
</script>
<br>
<span style="width:100px;"></span> 100px<br>
<span style="width:96px;"></span> 96px<br><br>
<span style="width:1rem;"></span> 1cm<br>
<span style="width:2rem;"></span> 2cm<br>
<span style="width:5rem;"></span> 5cm<br>
<span style="width:2.54rem;"></span> 1in,1in=2.54cm<br>
<span style="width:5.08rem;"></span> 2in,=5.08cm<br>
<span style="width:2.54rem;"></span> 72pt,=1in<br>
<span style="width:3.5277777777778rem;"></span> 100pt<br>
<span style="width:2.54rem;"></span> 6pc,=1in<br>
<span style="width:4.2333333333333rem;"></span> 10pc<br><br>
<span style="width:2.46rem;"></span> 1寸=2.46cm<br><br>
ID-1尺寸<br>85.60 × 53.98毫米 、<br>3.370 × 2.125英寸 、<br>242.64 × 153磅<br>
<span style="width:5.398rem;height:8.560rem;"></span><br>
直尺釐米<br>
<style>
.mm{display:block;margin:0;padding:0;height:0.1rem;width:0.3rem;min-height:1px;margin-left:0.1rem;}
.mm0{margin-left:0px;}
.mm10{margin-left:0px;background-color:#ff0000;}
</style>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm0"></span>
<span class="mm"></span>
<span class="mm mm10"></span>
</body>
</html>
相關文章
- 1. 寬度顯示banner
- 2. 網頁寬度
- 3. css 超過寬度顯示...
- 4. select2高度和寬度顯示問題
- 5. MySQL顯示寬度與字段長度
- 6. 最佳網頁寬度及其實現
- 7. 百度編輯器html網頁顯示
- 8. Dialog顯示寬度鋪滿屏幕寬度的設置
- 9. WebView顯示網頁
- 10. RecyclerView條目寬度顯示爲一半
- 更多相關文章...
- • ADO 顯示 - ADO 教程
- • HTML 頁面顯示 XML 數據 - XML 教程
- • 算法總結-廣度優先算法
- • 算法總結-深度優先算法
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
最新文章
- 1. Appium入門
- 2. Spring WebFlux 源碼分析(2)-Netty 服務器啓動服務流程 --TBD
- 3. wxpython入門第六步（高級組件）
- 4. CentOS7.5安裝SVN和可視化管理工具iF.SVNAdmin
- 5. jedis 3.0.1中JedisPoolConfig對象缺少setMaxIdle、setMaxWaitMillis等方法，問題記錄
- 6. 一步一圖一代碼，一定要讓你真正徹底明白紅黑樹
- 7. 2018-04-12—（重點）源碼角度分析Handler運行原理
- 8. Spring AOP源碼詳細解析
- 9. Spring Cloud（1）
- 10. python簡單爬去油價信息發送到公衆號
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. 寬度顯示banner
- 2. 網頁寬度
- 3. css 超過寬度顯示...
- 4. select2高度和寬度顯示問題
- 5. MySQL顯示寬度與字段長度
- 6. 最佳網頁寬度及其實現
- 7. 百度編輯器html網頁顯示
- 8. Dialog顯示寬度鋪滿屏幕寬度的設置
- 9. WebView顯示網頁
- 10. RecyclerView條目寬度顯示爲一半