在固定div位置下滚动时隐藏页面内容

时间:2017-06-17 06:01:38

标签: html css

我有一个固定的div位置,从页面顶部有一个边距,当我滚动页面时,我的相对位置div(具有页面内容)的内容在固定div下可见(我可以看到滚动内容,因为我的固定div有页面顶部的边距)。我在堆栈溢出中搜索了很多,并尝试每个解决方案,如给身体和Html填充或给我的相对定位div边缘或填充,但没有一个为我工作。仍然内容是可见的。我不想使用java脚本,也不想对body或Html使用填充。 我看到这些问题,但不适合我: link1link2link3link4。我的HTML代码如下:

<section class="all-result">
  <div class="nav">
   ...
  </div>
   <div class="results">
    .....
   </div>
</section>

和css看起来像:

.all-result{
 position:absolute;
 background: #fff;
 overflow-y: scroll;
 overflow-x: hidden;
 z-index: 4;
 right: 0;
}
.nav{ 
  position:fixed;
  margin-top:40px;
  z-index:1000;
  }
.results{
 width:100%;
 height:100%;
 position:relative;
 }

1 个答案:

答案 0 :(得分:0)

这里我添加了一个例子,我觉得你在寻找。

StringBuilder sb = new StringBuilder();
         DataTable dt = new DataTable();

         sb.Append(printDetails[0].Address);

         //Path to our font
         string Bamini = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.Fonts), "Bamini.TTF");
         //Register the font with iTextSharp
         iTextSharp.text.FontFactory.Register(Bamini);

         //Create a new stylesheet
         iTextSharp.text.html.simpleparser.StyleSheet ST = new iTextSharp.text.html.simpleparser.StyleSheet();
         //Set the default body font to our registered font's internal name
         ST.LoadTagStyle(HtmlTags.BODY, HtmlTags.FACE, "Bamini Regular");

         //Set the default encoding to support Unicode characters
         ST.LoadTagStyle(HtmlTags.BODY, HtmlTags.ENCODING, BaseFont.IDENTITY_H);

         //Parse our HTML using the stylesheet created above
         List<IElement> list = HTMLWorker.ParseToList(new StringReader(sb.ToString()), ST);

         return sb.ToString();
body{ overflow-y: scroll;}
.all-result
{
 position:absolute;
 width:100%;
 height:3000px;
 overflow: hidden;
 z-index: 4;
 background:#759A97;
}
.nav{ 
  width:100%;
  height:40px;
  position:fixed;
  margin-top:40px;
  z-index:1000;
  background:#B9B9B9;
  }
.results
{
 top:100px;
 height:300px;
 position:relative;
 background:#9A8975;
}