如何添加推送所有其他数据的固定横幅?

时间:2016-02-12 17:38:36

标签: html css

我希望为当前广告系列添加标题到我的网页。我有代码,直到这一点,但是当我添加它时,它覆盖了我的徽标和另一个标题。如何解决这个问题,以便将页面的其余部分推下来?

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Test</title>
<style type="text/css" media="screen">
 * {
   margin: 0; 
   padding: 0;
 }

 div#banner { 
   position: absolute; 
   top: 0; 
   left: 0; 
   background-color: #00AD83; 
   width: 100%; 
 }
 div#banner-content { 
   width: 200px; 
   margin: 0 auto; 
   padding: 10px; 
   border: 1px solid #000;
 }
 div#main-content { 
   padding-top: 70px;
}
</style>
</head>

<body>
<div id="banner">
<div id="banner-content">
Banner content will go here
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

为后面的内容添加上边距:

#banner + * {
  margin-top: 70px; /* or whatever the banner's actual height is  */
}