ホームページ > 記事 > ウェブフロントエンド > divを画面全体に表示させる方法(CSS)
divを画面全体に表示させる方法(CSS)
- 不言オリジナル
- 2018-05-09 11:41:084712ブラウズ
この記事では、div を画面全体に表示する方法 (CSS) を主に紹介します。これには、必要な友達がそれを参照できるように共有します。このようにして、p が画面全体に表示されます。
1. pの位置を設定します。
復習——
cssの位置には5つの属性があります:
静的: デフォルト値、位置決めなし
絶対: 絶対的な位置決め、親要素に対して相対的に配置されます
相対: 相対配置
fix: 固定配置、ブラウザウィンドウを基準に配置
継承: 親要素から配置情報を継承
デフォルト値の static と継承に加えて、次のことができます。他の 3 つを追加してウィンドウ適応を実装します。
コードは次のとおりです:
1 <style>
2 *{
3 margin: 0;
4 padding: 0;
5 }
6 div{
7 width:100%;
8 height: 100%;
9 background: yellow;
10 position: absolute;
11 }
12
13 </style>
14
15
16 <body>
17
18 <div></div>
19
20 </body>2. htmlとbodyの幅と高さを設定して、pを画面いっぱいに表示します
1 <style>
2 *{
3 margin: 0;
4 padding: 0;
5 }
6 html,body{
7 width: 100%;
8 height: 100%;
9 }
10 div{
11 width:100%;
12 height: 100%;
13 background: yellow;
14 }
15 </style>
16
17 <body>
18 <div></div>
19 </body>以上がこの記事の全内容です。 PHP中国語ウェブサイトへ。
以上がdivを画面全体に表示させる方法(CSS)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。