本文探讨了CSS中绝对定位（absolute）和固定定位（fixed）的使用，通过示例展示了如何创建一个始终位于顶部的导航栏。讨论了`.aaa`、`.bbb`、`.ccc`和`.ddd`类在布局中的作用，以及在不同浏览器下的兼容性解决方案。
< !-- * {
margin: 0;
padding: 0;
}
body {
margin: 0 auto;
font: 12px/20px tahoma Simsun Arial;
color: #fff;
background-color: #FFF;
text-align: center;
}
.aaa {
width: 150px;
background: Blue;
position: absolute;
left: 0;
top: 0;
}
.bbb {
width: 150px;
background: Blue;
position: absolute;
right: 0;
top: 0;
}
.ccc {
width: 150px;
position: absolute;
top: 100%;
left: 0;
margin-top: -20px;
background: Blue;
}
.ddd {
width: 150px;
position: absolute;
top: 100%;
right: 0;
margin-top: -20px;
background: Blue;
}
.aa {
width: 50px;
position: fixed;
background: Black;
_position: absolute;
_top: expression(eval(document.documentElement.scrollTop));
z-index: 1000;
left: 0;
top: 0;
}
.bb {
width: 50px;
position: fixed;
background: Black;
_position: absolute;
_top: expression(eval(document.documentElement.scrollTop));
z-index: 1000;
right: 0;
top: 0;
}
.a {
color: #000;
}
-->
A层和B层会随滚动条移动永久置顶
一键复制
编辑
Web IDE
原始数据
按行查看
历史
扫一扫
3414
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
