css一个单元格怎么加斜线

CSS在实现单元格加斜线的效果时，可以使用背景图和伸缩盒子两种方法来实现。下面分别介绍这两种方法的实现过程。

使用背景图实现斜线

/* HTML代码 */

<table>
  <tr>
    <td class="slash">单元格</td>
  </tr>
</table>

/* CSS代码 */

td.slash {
  /* 设置背景图片为斜线 */
  background: url(slash.png) repeat-y;
  /* 背景图位置为左上角 */
  background-position: top left;
  /* 背景图不进行平铺 */
  background-repeat: no-repeat;
  /* 单元格高度必须为奇数像素 */
  height: 21px;
  /* 让斜线垂直居中 */
  line-height: 21px;
  /* 让文字居中 */
  text-align: center;
} 

使用伸缩盒子实现斜线

/* HTML代码 */

<table>
  <tr>
    <td class="slash">单元格</td>
  </tr>
</table>

/* CSS代码 */

td.slash {
  /* 构建伸缩盒子 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* 让文字垂直居中 */
  line-height: 21px;
  /* 让文字居中 */
  text-align: center;
  /* 设置边框，实现斜线效果 */
  border-right: 1px solid black;
}
td.slash::before {
  /* 伪元素用于实现斜线 */
  content: "";
  /* 斜线宽度为1像素，高度为50% */
  width: 1px;
  height: 50%;
  /* 设置斜线颜色 */
  background: black;
  /* 设置旋转角度为45度 */
  transform: rotate(45deg);
  /* 让斜线垂直居中 */
  margin-top: 25%;
} 

以上是关于CSS实现单元格加斜线的两种方法，可以根据需求选择适合自己的方法来实现。