css+div学习小记(1) -

k0441258778983

浏览: 122566 次
性别:
来自: 广州

最近访客更多访客>>

zzy7075

k1g1h1

liangzi_001

lotus23333

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

css+div学习小记(1)

博客分类：

web前台

DIV固定在网页底部的CSS方法：
比如里面是一些版权信息。因为我整页的内容比较少，但是需要固定底部信息，不让它移动。
   基本思路=>
首先考虑外层设置一个容器DIV，id设为#container，使他的高度为浏览器窗口的高度，然后将#footer这个DIV设置为#container的子DIV，并使用绝对定位的方式，使他固定到#container的底端，以实现希望的把DIV固定在网页底部效果。
代码：

<style type="text/css">
   body{height:100%; margin:0;    padding:0;    font:12px/1.5arial; }
   #contaniner{min-height:100%; position:relative;}
   #content{padding: 10px;}
   #footer{    position:absolute;    bottom:0;       background-color:#AAA;    width:100%;   }
</style>
<body>
<DIV id="container">
    <DIV id="content">
      <p>请改变浏览器窗口的高度，以观察footer效果。</p>
      <p>这里是示例文字，DIV固定………，这里是示例文字。</p>
    </DIV>
    <DIV id="footer">
      <h1>Footer</h1>
    </DIV>
</DIV>
</body>

解释：body{height:100%; margin:0;    padding:0; }让整个body充满整个页面；
     #footer{    position:absolute;    bottom:0;}footer 绝对位置位于底部

----------------------------------------------------------------------------

   css代码中 margin:auto 和 margin:0 auto 有什么区别？
   答：有区别
       margin:auto是指上下左右全都auto
       margin:0 auto （其实表示margin:0 auto 0 auto）是指上下是0，左右auto
       auto实现居中很简单啊，你左右边距都auto了，其实就是居中

----------------------------------------------------------------------------
   如何将网页信息定位在浏览器的固定位置，而不随着滚动条滚动而改变；
   答：#fixed{position:fixed;top:5em;right:5em;}

      IE6中利用容器对溢出内容的处理方式来实现的

分享到：

EJB中的@ejb注解 | 循环调用spring的dao，数个过后无响应

2011-11-22 16:25
浏览 1223
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

css+div学习小记(1)

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

css+div学习小记(1)

评论

发表评论

相关推荐

css定位和浮动

jquery append插入页面元素之后，元素无法事件监听

jquery调用ajax方法 返回 object xml document

最近访客更多访客>>

jquery调用ajax方法返回 object xml document