一般三栏式的作法如下图所示,我的作法会有几个DIV框架:Top、Container、Left、Content、Right、Footer这几个常态会存在的DIV。
====================
CSS原始码
====================
body{
margin:0; padding:0px} (如果你要置中,在Firefox要正常,就要改成margin: 0px auto;)
#DivTop {
width:1000px;
} (或者设定百分比)
#DivContainer {} (可以不用设立width,没有设定会预设为100%)
#DivLeft {
width:200px; float:left; }
#DivRight {
width:200px; float:right;}
#DivContent {
margin-left:200px;margin-right:200px;}
#DivFooter {
clear:both;}
====================
HTML原始码
====================
====================
以上的HTML的排列是关键,中间的Container内包了左、中、右三个DIV内容,而左、中、右的原始码在本体HTML中的排列顺序依序是左、右、接下来才是Content
这是因为我们在左Div与右Div设立了float:left(right)的浮动,因此会IE、Firefox浏?器会先决定左右的位置后,最后的中间Content再排进来,因为我们设立了margin -left:200px;margin-right:200px;,因此空出了左右的区块宽度。
最后在DivFooter里一定要设定clear:both;的属性,是为了要清掉float的属性,好让footer可以紧接着在最下方正确呈现,若是你没有设立这个属性,嘿嘿...Footer就会给你浮上去,很不听话:P
另外,Firefox对CSS整个场景所设定的height会影响底端的Footer,以及对于padding与margin的判断,IE与Firefox很不一样,因此设定上要小心,这点当你反覆设计较复杂的版型时就会碰到,不过知道这点比较好办了,不外乎是加加减减的算数问题。
还有Firefox不吃text-align: center;这个CSS设定,因此传统的
相关文章推荐
• CSS3 学习笔记_html/css_WEB-ITnose• 提高网页性能的九大技巧_html/css_WEB-ITnose• 【动态页面】(一)前提_html/css_WEB-ITnose• Codeforces Round #275 (Div. 2) C• 前端要给力之:代码可以有多烂?_html/css_WEB-ITnose独孤九贱(3)_JavaScript视频教程
javascript是运行在浏览器上的脚本语言,连续多年,被评为全球最受欢迎的编程语言。是前端开发必备三大法器中,最具杀伤力。如果前端开发是降龙十八掌,好么javascript就是第18掌:亢龙有悔。没有它,你的前端生涯是不完整的。《php.cn独孤九贱(3)-JavaScript视频教程》课程特色:php中文网原创幽默段子系列课程,以恶搞,段子为主题风格的php视频教程!轻松的教学风格,简短的教学模式,让同学们在不知不觉中,学会了javascript知识。
JavaScript教程141537次播放
独孤九贱(6)_jQuery视频教程
jQuery是一个快速、简洁的JavaScript框架。设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。兼容各种主流浏览器,如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等,是全球最流行的前端开发框架之一。PHP中文网根据最新版本,独家录制jQuery最新视频教程,回馈PHP中文网的新老用户。
jQuery教程116233次播放
jQuery与Ajax基础与实战
jQuery是最流行的JS函数库,封装了许多实用的功能,其中最引人入胜的就是Ajax。 jQuery中的Ajax操作,语法简单,操作方便,使Ajax从未如此轻松,前端人员从此不再为与服务器异步交互而发愁,本套课程,精选了最常用的几个方法,从基本的语法到每个参数,再到具体实例进行了全面的讲解。
AJAX教程15866次播放
Git教程(60分钟全程无废话版)
Git 是一个开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。 Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。 Git 与常用的版本控制工具 CVS, Subversion 等不同,它采用了分布式版本库的方式,不必服务器端软件支持
JavaScript教程13837次播放