仓酷云

标题: 来谈谈:CSS实例教程:永久在网页底部的网页结构 [打印本页]

作者: 山那边是海    时间: 2015-1-15 23:54
标题: 来谈谈:CSS实例教程:永久在网页底部的网页结构
缩短改版时间。只要简单的修改几个CSS文件就可以重新设计一个有成百上千页面的站点。
网页制造poluoluo文章简介:CSS实例教程:永久在网页底部的网页结构.
看这个网页的底部,为何会跑到那儿往呢?即便内容很少的情形下,它也一直在页面的底部。
不然页面底部将留下大批空缺。

上面是它完成的代码:
<divid="wrap">
<divid="main"class="clearfix">
<divid="content">
</div>
<divid="side">
</div>
</div>
</div>
<divid="footer">
</div>


html,body,#wrap{height:100%;}
body>#wrap{height:auto;min-height:100%;}
#main{padding-bottom:150px;}/*必需利用和footer不异的高度*/
#footer{position:relative;
margin-top:-150px;/*footer高度的负值*/
height:150px;
clear:both;}


兼容性Hack:

.clearfix:after{content:".";
display:block;
height:0;
clear:both;
visibility:hidden;}
.clearfix{display:inline-block;}
/*HidesfromIE-mac*/
*html.clearfix{height:1%;}
.clearfix{display:block;}
/*EndhidefromIE-mac*/

你可以将许多网页的风格格式同时更新,不用再一页一页地更新了。
作者: 冷月葬花魂    时间: 2015-1-17 23:48
是当我和赵丽芬崔明艳老师进行交流后,很快就了解了还不太清楚的内容和并不了解的知识(像布局表格、绘制布局单元格等)。
作者: 老尸    时间: 2015-1-24 15:34
技术的学习如同长跑。只要越过极限,就会越跑越轻松。技术的学习其实并不像想象中那么可怕,任何技术都并不高深莫测。
作者: 金色的骷髅    时间: 2015-2-2 06:03
dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。
作者: 精灵巫婆    时间: 2015-2-7 17:50
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
作者: 蒙在股里    时间: 2015-2-22 22:37
可以使用 CSS 检查工具进行设计。
作者: 若相依    时间: 2015-3-14 14:56
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
作者: 透明    时间: 2015-3-21 12:19
不管老师做怎样的解释,而我却对它感到很是吃力,诸如里面有许多不知道的功能。




欢迎光临 仓酷云 (http://ckuyun.com/) Powered by Discuz! X3.2