Web设计学习

两栏自适应带头尾

回想起刚刚工作的时候,作为一个一入HTML/CSS的门就跟着CSS设计风格走的人,各种经验其实还不是很丰富,想要说服公司里的那群Table党,其实并不是什么容易的事情。尤其是当他们举出一些对table布局来说很轻松的case时,我却拿不出应对的方案。其中有两个让我纠结很久的问题,一是自适应页脚(当页面不足一屏高时显示在屏幕下,当页面超过一屏高时跟在内容后面),另一种是自适应宽度的多栏布局。

后来渐渐的,经验开始丰富起来,也离开了之前的单位,新的单位中从零开始的设计变少了,更多的是维护工作,也就渐渐地把网页设计的基本功给淡忘了。最近因为朋友买了域名开始着手设计个人网站,我才突然有性质再捡起一些无意间丢掉的东西来。

首先想到的就是上文提到的两种情况,当时经验浅薄,也没什么见识,这件事情会着实困扰到我。而最近我在Github上抄袭设计(做我那个RewindBug)时,留意到了Github的页脚设计。放到自己提炼的简单情况下来,稍微做了些修改,得出了一个让我还觉得的结果。至少,这个布局结构比我预想的还要健壮一些,除了为了保险起见加的clearfix外没有使用任何hack代码,同时包括了自适应两栏和自适应页脚,居然能在最低IE6下很好地工作……

[pyg l=”html” s=”autumn” tabwidth=”2″ linenos=”table”]





something here

something here.



[/pyg]

发表评论

电子邮件地址不会被公开。 必填项已用*标注