借鉴学习

26 10月

css实现左侧固定宽度，右侧自适用宽度

2010-10-26 借鉴学习

在百度知道里面看到有人提问如何实现左侧固定宽度，右侧自适用宽度。有很多种实现的方法，一种是通过js，也有使用纯css实现的。于是自己也动手试试。通过使用css来实现，比起网上其他的解决方法，算是比较简洁的一种。

<style type="text/css"> 
    html, body {height: 100%;margin:0px;padding:0px;} 
    .main{position:relative;width:100%;height:100%;margin:0px auto;} 
    .left{position:absolute;left:0px;top:0px;width:150px;height:100%;background-color:green;} 
    .right{width:auto;margin-left:150px;height:100%;background-color:red;} 
</style>

查看效果：https://www.doweb.me/laboratory/css/page2.html