Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/37.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
css和html div问题…为什么我增加div高度时会为背景图像添加上边距?_Html_Css - Fatal编程技术网

css和html div问题…为什么我增加div高度时会为背景图像添加上边距?

css和html div问题…为什么我增加div高度时会为背景图像添加上边距?,html,css,Html,Css,这是我在codepen的第一个设计 我有一个简单的问题。。当我增加div高度时,为背景图像添加不需要的上边距 我想删除由div高度引起的背景图像边距 <body> <header> <ul> <li><a href="#">Home</a></li>| <li><a href="#">Services</a></li>|

这是我在codepen的第一个设计

我有一个简单的问题。。当我增加div高度时,为背景图像添加不需要的上边距


我想删除由div高度引起的背景图像边距

<body>
<header>
    <ul>
        <li><a href="#">Home</a></li>|
        <li><a href="#">Services</a></li>|
        <li><a href="#"> About Us  </a></li>|
        <li><a href="#"> Contact Us  </a></li>
    </ul>

    <p> Title goes here </p>
    <input type="email" placeholder="Your Email"><br>
    <input type="submit" value="Submit">
</header><!--ENDING HEADER -->
<!-- content -->
<div class="img1"><p> paragraph goes her<br ><a> More Details   </a></p></div>
<div class="img2"><p>paragraph goes her<br ><a>More Details  </a></p></div>
<div class="img3"><p>paragraph goes her<br ><a>More Details  </a></p></div>

</body>
请不要投我反对票。:)


谢谢

在div css属性中添加位置:绝对。。。希望这有助于改变背景位置:中心至<代码>背景位置:顶部…不是100%确定我理解了这个问题,但这是我看到代码后的第一反应。

请给我们提供更多关于您试图做什么的信息,并指出您正在谈论的div!请在此处发布相关代码^jsFiddles也有帮助!:)我想删除由div高度引起的背景图像边距。您的问题应该是独立的,也就是说,相关代码应该在现场提供。我这样做了,虽然它删除了顶部边距,但导致三个div出现问题。我得到了一个等待,我可能会帮助umargin top:-50px;如果高度=150px,如果高度=200,则余量顶部:-100px;希望这有助于消除这种观点:绝对正确背景观点:我没见过抱歉浪费你的时间不,我浪费你的时间不是你,谢谢
*{
 margin:0;
 padding:0; 
    }
body{
width:800px;
min-height:100px;
margin:0 auto;  
background:url(http://str-ly.com/up/uploads/str-ly.com13810941559511.jpg) no-repeat;
background-size:800px 500px;
background-position:center;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:24px;
color:white;
}
/* ----- HEADER ---------*/
header{
text-align:center;

}
img{
border-radius:80%;  

}

input[placeholder]{
text-align:right;
padding:10px;
border:0;   
}
input[type="submit"]{
 margin:30px 0 0 0;
 padding:10px;  
 font-weight:bold;
 font-size:20px;
}

ul{
 list-style:none;
 background:rgba(0,0,0,.5);
}
li{

 display:inline;
}
a{
text-decoration:none;
color:white;
}
/*---------- CONTENT -------------*/
div{
 height:150px;
}

p{
 color:#000;
}
div p{
 color:#ff0055;
 text-align:right;
 padding-right:50px;
}
p a{
 position:absolute;
 left:600px;

}