Question

我的设计需要白色背景，但前100px需要没有背景。所以我做了什么，我使用margin-top来推下具有白色背景的div并将另一个div放在这个div中并使用我用来推动第一个div的负数将其拉出来。它工作正常。但正因为如此，我有100px的未使用空间，我需要摆脱它。我怎样才能实现它？

＆＃13;

<div id="container">
<div id="margin-top" style="margin-top: 100px;">
   <div id="negative-top" style="position: relative; top: -100px;">
      content
   </div>
</div>
<div>

＆＃13;

Answer 1

试试这个方法，它会对你有用。

<div id="container">
<div id="margin-top" style="margin-top: 100px;">
<div id="negative-top" style="margin-top: -100px; padding-top: 100px">
content
</div>
</div>
<div>

Answer 2

您还可以在身体上使用渐变而不是背景颜色，并消除负边距。

background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 20px, #000000 20px, #000000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 20px,#000000 20px,#000000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#ffffff 20px,#000000 20px,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

父母的边缘 - 顶部，儿童的负顶部，如何摆脱

2 个答案: