table-cell完成左侧定宽，右侧定宽及左右定宽等布局的实现方法

使用table-cell布局是一种简单而强大的网页布局技术，可以实现左侧定宽、右侧定宽以及左右都定宽的布局。以下是实现这些布局的步骤：

左侧定宽，右侧自适应布局

可以通过将左右两个区块设置为表格单元格，并使用CSS的width属性和display属性对区块进行设置。

HTML结构：

<div class="container">
  <div class="left">左侧区域</div>
  <div class="right">右侧区域</div>
</div>

CSS样式：

.container {
  display: table;
  width: 100%;
}

.left,
.right {
  display: table-cell;
  border: 1px solid #000;
  padding: 10px;
}

.left {
  width: 200px;
}

通过将容器元素设置为display: table，左右两个子元素设置为display: table-cell，可以让它们基于表格布局来进行呈现。同时，通过设置.left的宽度为200px，可以使左侧区块定宽为200px，右侧区块则会根据剩余空间自适应。

左右都定宽布局

同样是通过将左右两个区块设置为表格单元格，并使用CSS的宽度属性和display属性对区块进行设置。

HTML结构：

<div class="container">
  <div class="left">左侧区域</div>
  <div class="right">右侧区域</div>
</div>

CSS样式：

.container {
  display: table;
  width: 100%;
}

.left,
.right {
  display: table-cell;
  border: 1px solid #000;
  padding: 10px;
  width: 50%;
}

通过将容器元素设置为display: table，左右两个子元素设置为display: table-cell，同时将它们的宽度都设为50%，将会让左右两个区块分别占据整个容器的50%的宽度，从而实现左右都定宽的布局。

以上是使用table-cell布局实现左侧定宽、右侧定宽以及左右定宽的布局的攻略。