Webページサイズ適応スクリーン解像度テストコード
14362 ワード
<html>
<head>
<meta charset="utf-8">
<title>Responsive Design Testingtitle>
<style>
body { margin: 20px; font-family: sans-serif; overflow-x: scroll; }
.wrapper { width: 6000px; }
.frame { float: left; }
h2 { margin: 0 0 5px 0; }
iframe { margin: 0 20px 20px 0; border: 1px solid #666; }
style>
head>
<body>
<div class="wrapper">
<div class="frame">
<h2>1024 × 600 <small>(mobile)small>h2>
<iframe src="./" sandbox="allow-same-origin allow-forms" seamless width="1024" height="600">http://127.0.0.1:8020/contract/index.htmliframe>
div>
<div class="frame">
<h2>1280 × 800 <small>(small tablet)small>h2>
<iframe src="./" sandbox="allow-same-origin allow-forms" seamless width="1280" height="800">http://127.0.0.1:8020/contract/index.htmliframe>
div>
<div class="frame">
<h2>1366 × 768 <small>(tablet - portrait)small>h2>
<iframe src="./" sandbox="allow-same-origin allow-forms" seamless width="1366" height="768">http://127.0.0.1:8020/contract/index.htmliframe>
div>
<div class="frame">
<h2>1440 × 900 <small>(tablet - landscape)small>h2>
<iframe src="./" sandbox="allow-same-origin allow-forms" seamless width="1440" height="900">http://127.0.0.1:8020/contract/index.htmliframe>
div>
div>
body>
html>