只设置边框左右 CSS

简介

在开发中，我们常常需要给某个元素设置边框，但有时候我们需要只给元素的左或右设置边框，而不是四个方向都设置。这时候，我们可以使用 CSS 的 border-left 和 border-right 属性来实现。

border-left 和 border-right 属性

border-left 和 border-right 属性分别用于设置元素的左和右边框。这两个属性的语法如下：

border-left: border-width border-style border-color;
border-right: border-width border-style border-color;

• border-width：边框的宽度，可以使用 px、em 或其它单位。
• border-style：边框的样式，可以使用 solid、dotted、dashed 等等。
• border-color：边框的颜色，可以使用具体颜色值、十六进制颜色值或 rgb() 函数。

示例

下面是一个例子，展示如何只设置元素的左右边框：

div {
  border-left: 2px solid red;
  border-right: 2px solid blue;
}

该示例会给 div 元素的左侧设置一个 2px 宽的红色边框，右侧设置一个 2px 宽的蓝色边框。

总结

通过使用 border-left 和 border-right 属性，我们可以很方便地只给元素的左或右设置边框，而不需要设置四个方向的边框。该属性在实际开发中会有一定的应用场景，在需要实现特殊效果时，可以尝试使用。