如何使我的网站变成两部分黑色,一部分是白色的div



所以我一直在努力弄清楚如何将我的网站的两部分变成黑色,一部分是白色的。

例如,您继续访问该网站,上半部分是黑色的,然后中半部分是

白色的,然后下半部分是黑色的。

我将如何使用CSS和HTML执行此操作

我知道对于 html,我需要使用div 元素,但不确定如何去做。

试试这个。

body{
  margin:0;
}
.wrap {
  height: 100vh;
}
.black{
  background:#000;
  height:33.33%;
  width:100%;
}
.white{
  background:#fff;
  height:33.33%;
  width:100%;
}
<div class="wrap">
  <div class="black">black part</div>
  <div class="white">white part</div>
  <div class="black">black part</div>
</div>

html:

<body>
    <div id="header"></div>
    <div id="content"></div>
    <div id="footer"></div>
</body>

.css:

#header{
width:100%;
height:33%;
background-color:black;
}
#content{
width:100%;
height:33%;
background-color:white;
}
#footer{
width:100%;
height:33%;
background-color:black;
}

最新更新