回到基本
光秃的精华 固定的布局版本3
看起来好象这类型布局造成问题为一些访客因此我引起了逐字地是回到基本的这次示范。
首先交换IE 入突变方式由开始HTML 与:
<?xml version="1 。0"encoding="UTF-8 "?>
CSS - HTML 标记:
HTML {
高度:100%; / * 固定高度到100% 为IE */
最大高度:100%; / * 固定高度为其它浏览器*/
填料:0; /*remove 填料*/
边际:0; / * 去除边际*/
疆界:0; / * 去除疆界*/
背景:# fff; /*color 背景- 唯一工作在IE */
字体大小:76%; /*set 缺省字体大小*/
字体家庭:佐治亚, "palatino 行型活字", "times.new.roman", serif; / * 集合缺省字体*/
/ * 皮溢出:掩藏从IE5/Mac */
/ * \ */
溢出:掩藏; /*get 被赶走转下杆在IE */
/ * */
}
CSS - 身体标记:
身体{
高度:100%; / * 固定高度到100% 为IE */
最大高度:100%; / * 固定高度为其它浏览器*/
溢出:掩藏; /*get 被赶走转下杆在IE */
填料:0; /*remove 填料*/
边际:0; / * 去除边际*/
疆界:0; / * 去除疆界*/
}
这现在给100% x 100% 的HTML/身体尺寸没有我们能安置倒栽跳水和步行者使用位置绝对在正常方式的转下杆。 倒栽跳水和步行者将停留固定因为身体无法移动。
好。 现在应付必须是固定的在倒栽跳水之下, 在步行者和纸卷之上在溢出的内容。 IE 有一个完全另外方式做这对所有其它浏览器!.
首先' 其它浏览器的
# 内容{
溢出:自动; / * 当有必要* 增加转下杆/
位置:绝对; / * 位置绝对*/
z 索引:3; / * 如果必须盖任何其它divs */
上面:100px; / * 价值错过倒栽跳水*/
底部:50px; / * 价值错过步行者*/
左边:200px; / * 价值错过任何航海div */
权利:0; / * 这将投入转下杆在权利页*/
背景:# eee; / * 设置背景颜色*/
}
并且最后设定为不了解在上面# 内容的IE
这采取溢出:自动; 位置:绝对; 并且z 索引:3; 从# 内容上面和使用文丐* HTML # 内容(对目标IE 唯一) 改变# 内容给div 100% x 100% 和使用疆界价值避免倒栽跳水和步行者。 倒栽跳水和步行者的z 索引价值应该大比# 美满的价值以便他们将坐在顶部# 美满的疆界。
* HTML # 内容{
高度:100%; / * 全荧光屏高度*/
宽度:100%; / * 全荧光屏宽度8
上面:0; / * 安置内容在上面*/
左边:0; / * 和左身体*/
疆界上面:100px 固体# fff; /*add 顶面疆界错过倒栽跳水
(这被减去从100% 高度在突变方式) */
疆界底部:50px 固体# fff; /*add 一个底下疆界错过步行者
(这被减去从100% 高度在突变方式) */
疆界左:200px 固体# fff; /*add 一个左疆界错过任何航海div
(这被减去从100% 宽度在突变方式) */
}
并且那基本上是它。
您的评论
这一个运作在IE5 。01, IE5 。5, IE6, 歌剧7 。23, Mozilla 和Firefox
NN7 正确地显示但绝对被安置的div 在美满的区域停留' 固定了' 作为美满的纸卷。
© 2004 年斯图尔特Nicholls















平板模式