css和html div问题…为什么我增加div高度时会为背景图像添加上边距?
这是我在codepen的第一个设计 我有一个简单的问题。。当我增加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>|
我想删除由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;
}