<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 7 年前。
jquery - 在css中如何在没有空格的情况下加入两个div类？
在我的 css 中我有以下内容:--
body {
background-color: #ffffff;
font-family: arial, georgia, sans-serif;
font-size: 16px;
}
.wrapper {
width: 100%;
position: relative;
min-height: 1300px;
background-color: yellow;
-webkit-box-shadow: -10px 0 15px #000;
-moz-box-shadow: -10px 0 15px #000;
box-shadow: -10px 0 15px #000;
-webkit-transition: -webkit-transform 0.2s ease;
-moz-transition: -moz-transform 0.4s ease;
-ms-transition: -ms-transform 0.4s ease;
-o-transition: -o-transform 0.4s ease;
transition: transform 0.4s ease;
}
.header1 {
width: 100%;
position: relative;
min-height: 90px;
clear:both;
background: url(../images/tooplate_footer1.png) no-repeat;
-webkit-transition: -webkit-transform 0.2s ease;
-moz-transition: -moz-transform 0.4s ease;
-ms-transition: -ms-transform 0.4s ease;
-o-transition: -o-transform 0.4s ease;
transition: transform 0.4s ease;
}
input[type="checkbox"]:checked ~ .wrapper {
-webkit-transform: translateX(250px);
-moz-transform: translateX(250px);
-ms-transform: translateX(250px);
-o-transform: translateX(250px);
transform: translateX(250px);
}
input[type="checkbox"]:not(:checked) ~ .wrapper {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
input[type="checkbox"]:checked ~ .header1 {
-webkit-transform: translateX(250px);
-moz-transform: translateX(250px);
-ms-transform: translateX(250px);
-o-transform: translateX(250px);
transform: translateX(250px);
}
input[type="checkbox"]:not(:checked) ~ .header1 {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
@media only screen and (min-width: 35em) {
.wrapper {
max-width: 1000px;
margin: 0 auto;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.header1 {
max-width: 1020px;
margin: 0 auto;
clear:both;
}
下面是我的 html；-
<body>
<div class="wrapper">
</div>
<div class="header1"></div>
</body>
现在我得到这样的页面
我想删除这个空间。所以，两个 div 类可以连接在一起。我用过 margin-top:0px;但空间并没有被删除..请给我建议。
最佳答案
两个 div 之间的空间来自环绕背面的 div，它使 div 比看起来高。
要将其向上移动，请对顶部边距使用负值。
例如
.header1 {
width: 100%;
position: relative;
min-height: 90px;
clear:both;
background: url(../images/tooplate_footer1.png) no-repeat;
-webkit-transition: -webkit-transform 0.2s ease;
-moz-transition: -moz-transform 0.4s ease;
-ms-transition: -ms-transform 0.4s ease;
-o-transition: -o-transform 0.4s ease;
transition: transform 0.4s ease;
margin-top: -4px; //HERE
}
关于jquery - 在css中如何在没有空格的情况下加入两个div类？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31563933/