css實現左右佈局，左側div固定不變，右側div寬度自適應

1.如果不考慮瀏覽器的兼容問題的話，可以使用css3的新增屬性 calc()  ;calc是calculate的簡寫，漢語爲計算的意思。

.left{
  width: 200px;
  float: left;
  height: 200px;
  background: pink;
}
.right{
  float: left;
  width: calc(100% - 200px);
  height:200px;
  background: yellow;
}

   該方法省去了人工計算.right   div的寬度百分比

2. 可以使用百分比進行佈局，該方法不需考慮瀏覽器的兼容性.但與第一種進行比較， 右側div的寬度百分比需要自己去進行計算。

.left{
  width: 200px;
  float: left;
  height: 200px;
  background: pink;
}
.right{
  float: left;
  width:85%;
  height:200px;
  background: yellow;
}

3.使用絕對元素進行定位

.left{
  width: 200px;
  height: 200px;
  position: absolute;
  background: pink;
}
.right{
  left: 200px;
  right: 0;
  height:200px;
  position: absolute;
  background: yellow;
}

4.div的寬度在不進行設置的情況下會自動填滿父標籤的寬度。所以我們可以並不對右側div的寬度進行設置

.left{
  width: 200px;
  height: 300px;
  float: left;
  background: pink;
}
.right{
  height:300px;
  margin-left: 200px;
  background: yellow;
}

5.使用table佈局。這個就不多說了~~~