こんにちは、
スクリーンショットを参照してください、私は常に画面の100％を取るために私の簡単なcountdcownに合うことができるか知りたいですか？私はそれを私の電話に合うように作ったが、Idはそれがデスクトップ上でも100％であるのが好きだ。
私が試したもの：
html{
width:100%;
height:100%;
}
body{
width:100%;
height:100%;
}
しかし、これは本体のみ100％になります。.. どこから始めますか？誰かチュートリアルや何かを持っていますか？
vwまたはvh（ビューポート）を使用する簡単な例を試してみると、その違いがわかります。
あなたの要素を中央に配置することも。あなたが使用できます。
display: flex;
align-items: center;
justify-content: center;
垂直センタリング
REF：https://philipwalton.github.io/solved-by-flexbox/demos/vertical-centering/
ビューポート
REF：https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
body {
margin: 0;
}
.test1 {
background: red;
width: 100%;
height: 300px;
display: flex;
align-items: center;
justify-content: center;
}
.test2 {
background: green;
width: 100vw;
height: 300px;
display: flex;
align-items: center;
justify-content: center;
}
.innerwraper {
height: 100px;
width: 200px;
background: aqua;
}<div class="test1">
<div class="innerwraper">This is 100% width</div>
</div>
<div class="test2">
<div class="innerwraper">This is 100vw</div>
</div>自動的に高さ及びボディの幅は100％であり、あなたのコードは役に立たないであるので、他の値に変更することはできません。 コンテンツの高さと幅を大きくするには、コンテンツのCSS高さと重量プロパティ（ボタン、テキスト入力、divなど）を変更する必要があります。
'vw'と 'vh'にすべてのサイズ、長さ、幅を定義する必要があります。ビューポートの幅とビューポートの高さを表します。これにより、ブラウザに、オブジェクトのサイズを画面の幅（または、選択したものに応じて高さ）に応じてレンダリングするように指示されます。
例では、すべてのオブジェクトは約20vhの高さで、余白は5vhです。 4つのオブジェクトは完全な100vh（100％ビューポートの高さ）になります。
あなたはこのCSSを始めることができ：
input, div {height: 20vh; margin: 5vh 1vh;}
あなたは、たとえば、divの中のボタンとビューの全体の組み合わせをラップすることができます：
<div id = "wrapper"> </div>
その後のdivの内側に各要素のを修正高さと幅はパーセンテージに基づいています。たとえば、縦に4つの要素があり、下に3つのボタンがあります。だから、底にあるあなたの3つのボタンは、別のdivでさらに包まれて1つの要素として機能します。次に、4つの要素をheight: 25%;に分割し、幅を継承させることができます。それは次のようになりますので
：
<body>
<div id="wrapper">
<div class="element"> insert element here such as input </div>
<div class="element"> element here such as input button </div>
<div class="element"> element here such as counter </div>
<div class="element">
<div> </div>
<div> </div>
<div> </div>
</div>
</div>
CSS：コードのブロック内のすべてのプロパティの上
.element{
height:25%;
width:inherit;
}
#wrapper{
height:100%;
width: 100%;
}
コンテンツは一切* { box-sizing: border-box; }
が存在しない場合はしませんフィット...
使用100vw？ （ビューポート） –
私たちが見る/複製できるように残りのコードを投稿してください。チュートリアルを探すのは、stackoverflowのトピックです。 https://stackoverflow.com/help/on-topic –
https://stackoverflow.com/questions/17555682/height-100-or-min-height-100-for-html-and-body-elements – Fahmi