Question

问我的问题是否 st,但我是否m在安执委会定位灵活箱子周围,而这一切固然 st,但真的想要使我的网站更加看上去? 我的心中如此。 https://i.stack.imgur.com/ktiDY.jpg”rel=“nofollow noreferer”>。

至今,我真的希望这一平方部分凌驾具有背景形象的我的英雄部分之上。就像这个专题或类似的东西。不需要提供法典(尽管受到赞赏),但只是想知道这一技术。增编

Answer 1

对于“过渡”或将一个因素推向另一个因素,简单的解决办法是,在超支方面使用负差值,同时在基本要素下进行额外dding。

body {
  margin: 0;
  font-family: sans-serif;
  background: #f4f4f4;
}

.banner {
  background-image: url(http://picsum.photos/1280/600);
  background-size: cover;
  color: white;
  padding: 2em 30vw 70px 10vw;
  text-shadow: 0 0 5px rgb(0 0 0 / 0.5);
  box-sizing: border-box;
}

button {
  background: darkorange;
  color: white;
  border: 0;
  font-size: 1em;
  border-radius: 4px;
  padding: 10px 30px;
}

.box {
  background: white;
  font-size: 2em;
  font-weight: bold;
  width: 80%;
  margin: -35px auto 0 auto;
  padding: 30px;
  box-sizing: border-box;
  display: flex;
  gap: 1em;
  justify-content: center;
}

main {
  padding: 2em 10vw;
}

<div class="banner">
  <h1>Banner text blah blah blah</h1>
  <p><button>Learn more</button></p>
</div>

<div class="box">
  <div>3M+</div>
  <div>3.2M</div>
  <div>170</div>
</div>

<main>
  <p>Page continues</p>
</main>

友情链接