Html 当我给文本加上上页边空白时,为什么整个图像会下降?
在HTML之后,在背景中显示一张图片,并在上面显示nhs订阅的文本。现在,当我给class=nhs\u标题空白时,顶部文本和图像一起向下移动。为什么会这样 我怎么能给文本留空白呢Html 当我给文本加上上页边空白时,为什么整个图像会下降?,html,css,Html,Css,在HTML之后,在背景中显示一张图片,并在上面显示nhs订阅的文本。现在,当我给class=nhs\u标题空白时,顶部文本和图像一起向下移动。为什么会这样 我怎么能给文本留空白呢 <body> <div class="image_holder"> <div class="nhs_head"> NHS SUBSCRIPTION </div> </div> </body> 如果要将边距顶部应用于文本,可
<body>
<div class="image_holder">
<div class="nhs_head"> NHS SUBSCRIPTION </div>
</div>
</body>
如果要将边距顶部应用于文本,可以将文本定位在相对定位的图像div中
css
请参见此问题:使用填充顶部而不是边距顶部@j08691应用边界属性时会发生什么!我也必须给它一个边界
.image_holder {
position:relative;
background-image:url(bg2.jpg);
height:768px;
width:1366px;
}
.nhs_head {
display:block;
width:60%;
margin:0 auto;
border:2px solid white;
font-family:Calibri;
font-weight:800;
font-size:30px;
color:white;
}
body, html {
margin:0;
}
.image_holder {
position: relative;
background-image:url('http://blog.jimdo.com/wp-content/uploads/2014/01/tree-247122.jpg');
height:768px;
width:1366px;
}
.nhs_head {
width:60%;
margin:0 auto;
border:2px solid white;
font-family:Calibri;
font-weight:800;
font-size:30px;
margin-top: 30px;
color:white;
position: absolute;
left:0;
right:0;
margin-top: 30px;
}