Html 将屏幕分为4个矩形，50%高50%宽_Html_Height_Width_Css

Html 将屏幕分为4个矩形，50%高50%宽

html css

Html 将屏幕分为4个矩形，50%高50%宽,html,height,width,css,Html,Height,Width,Css,我无法将屏幕拆分为4个宽度和高度为50%的分区。获得50%的宽度并将其浮动是没有问题的，但是如何使它们每个都具有屏幕50%的高度？我想您已经习惯于设置宽度；同样的东西也可以用来测量你的身高例如： <html> <head> </head> <body> <div style="background-color:red; width:50%; height:50%; float:left"> </div> <di

我无法将屏幕拆分为4个宽度和高度为50%的分区。

获得50%的宽度并将其浮动是没有问题的，但是如何使它们每个都具有屏幕50%的高度？

我想您已经习惯于设置宽度；同样的东西也可以用来测量你的身高

例如：

<html>
<head>
</head>
<body>

<div style="background-color:red; width:50%; height:50%; float:left">
</div>

<div style="background-color:blue; width:50%; height:50%; float:right">
</div>

<div style="background-color:green; width:50%; height:50%; float:left">
</div>

<div style="background-color:orange; width:50%; height:50%; float:right">
</div>

</body>
</html>

不明白为什么elemts现在伸展到50%的高度。但他们确实如此。

html,body {
        padding:0;
        margin:0;
        height:100%;
        min-height:100%;
      }