CSShack 布局

来源:互联网 发布:云计算与虚拟化的区别 编辑:程序博客网 时间:2024/06/06 21:04

在这里将会收集相关经典的css hack 布局的一些例子。

1. 让一个尺寸不定的div距离浏览器上下左右都为10px

//cssdiv{    border:1px solid red;    position: fixed;    left: 50px;    right: 50px;    top: 50px;    bottom: 50px;}//html<div></div>

这里写图片描述

2.footer在一屏以内时固定在最下面,超出一屏自动在内容后面

//css.content {     min-height: 100%;     background: #ddd;}* .content {     height: 100%;//兼容IE}.footer{    margin-top: -100px;//采用负值外补丁来实现的    height: 100px;    background: #000;    color: #fff;}//html<div class="content" >    content</div><div class="footer">    footer</div>

这里写图片描述

3定义一个兼容低版本浏览器高度为1px的div

//css.line1px{    width:200px;    height:1px;    line-height:1px;    font-size: 0;    overflow: hidden;    background:red;}//html<div class="line1px">&nbsp;</div>}
0 0
原创粉丝点击