固定(这仍然是静态的窗口滚动)的页块只使用CSS

这个职位可能那句“教学奶奶班门弄斧”是一个很好的例子,因为这仅仅是基本的CSS的东西。 但是,对于那些无视我一样的,这可能是一种变相的祝福。 我一直以为(这样说,我可能失去对我的工作),这是唯一可能保留一些静态的HTML页面内容的一部分(意思是,它的立场始终对窗口滚动),使用一些聪明的脚本,否则所有这些科学计算的动态位置,诱捕Window.scroll事件和超时等设置

从来没有想过它可以像这样简单...... 在这里,我在下面的CSS / HTML有四个静态块,固定在每个页面extrimities,上,右,底部和左侧...不用说...你可以选择任何一个或多个,如果需要...

的CSS
静态显示:块;的z-index:10;颜色:#FFFFFF;溢出-X:隐藏溢出-Y:隐藏;位置:ixed;
}
#内容{保证金:100px的为150px 0px 160px【边界:1px固体#e6e6e6}

#总结T {TOP:0px;背景:#33CC66;宽度:100%;高度:55像素;

#包-L {:80px的背景:#FF9966;高度:300像素,宽度为150px;边界:2px的坚实#e6e6e6;}

#包-B {底部:0px;背景:#3333CC;宽度:100%;高度:55像素;}

#包-R {:80px的背景:#6666FF;高度:300像素;宽度:140px单击;边界:2px的坚实#e6e6e6;右:0;}

的HTML
<div id="contents">您的主要网页内容</ DIV>
<div id="wrap-b" class="static">
静态内容页底部
</ DIV>
<div id="wrap-t" class="static">
静态内容页首
</ DIV>

<div id="wrap-l" class="static">
页面的静态内容的左侧
</ DIV>
<div id="wrap-r" class="static">
在页面右侧的静态内容
</ DIV>

查看样品这里wroking


发表评论

NDK的家 | 表达它 表示唇腭裂 表示Penmenship 表示敬畏 表达自己