布局
CSS至关要紧有哪些用途, CSS的设计初衷.
CSS布局和几年前table横行时的布局又不太一样, 在结构化语义化的HTML文档后面, CSS在格式化文档的渲染成效, 把结构化文档用表现化语言来描述. 简而言之, 就是CSS无需表现性标签!
CSS布局技术依靠于三个基本定义: 定位, 浮动, margin操纵. 布局技术之间没本质有什么区别, 相同一种布局让100个前端开发工程师来做, 可能就有100种办法.
居中
在tabl奥创, align和Valign相当的好使, 而在CSS中却没简单达成的办法,所以在标准化刚最初推广的时候, 不少重构项目中居中问题变成了妨碍标准化进步的绊脚石.
1. 自动外补丁水平居中
通常情况下水平居中很容易达成, 仅需给要居中的容器设定宽度, 与自动水平外补丁就能了.
譬如HTML如下:
＜body> ＜div> ＜/div> ＜/body>
CSS如下:
body{} .wrapper
非常简单不是吗? 但有点小问题... 大家亲爱的IE家族里, IE5.x和IE 6不支持自动外补丁, 但同样幸运的是, IE将 text-align:center 理解为所有东西居中, 而不仅仅是文本. 哈哈, 可以借助这个Bug.
将CSS改为:
body .wrapper
这里就用到了一种Hack,不过不会干扰其他浏览器的Hack就是好Hack,呵呵, 就先这么用着吧~
等等, 仿佛Netscape那边也出问题了, 用Netscape 6将窗口缩小到小于容器宽度时, 容器的左侧就会跑到屏幕外边去了, 而且还不会有滚动条...万恶的浏览器大战啊...
再来改改大家的CSS:
body
.wrapper
如此就基本上ok了.
网页题目网站建设CSS高级方法之网站布局
