一道布局题,进来试着做下


  大家看到这张图可能已经开始揣摩该怎么布局了,可能您一眼就看出来用常规的浮动布局已然是不太合适,那么用相对绝对定位呢?大家可别光看说很简单,动手写写,说不定别人有更好的方法。值得一提的是,login-foot模块比较特殊,页面有一个最小的高度,当显示屏的分辨率小于这个高度时就会出现纵向的滚动条,而如果大于的话login-foot又跑到屏幕的底部(当然它始终是位于页面底部,但并不一定在屏幕底部)。
      居然没一个人动手来做一下,看来都是高手,那我只好自己系铃解铃了。
      想要定位各元素那就要有一个参照物,我们可以在紧贴body里新添一个层container,将它的position属性设为relative,然后将各元素position属性设为absolute,利用top和left属性对其定位。
      其中的图片动态显示只需根据具体的日期判断置换图片地址,比如节日背景和月份图片。
      只剩下底部了,它最麻烦,它的需求是当浏览器高度小于某个值时就会出现纵向滚动条,如果大于时则login-foot永远位于浏览器底部。如何实现呢,用纯CSS显然已经无法实现,那就得javascript 了。
     
Code
  
  web初学者,初学者园地。
posted @ 2009-09-24 00:03  帅气十足  阅读(399)  评论(3)    收藏  举报