使用HTML Div仅在顶部和底部添加边框？

我使用HTML DIV标记格式化我的标题和边框，如下所示：

<h3 style="background-color:red; padding:2% 0 2% 0; border:5px solid green">
This is a header
</h3>

这是一个标题

---

但是，我希望边框只显示在顶部和底部，而不显示在左侧和右侧。我希望边框和左上下和右上的填充一样，但是边框没有这个功能（或者我不知道？）。CSS样式中有什么方法可以做到这一点吗？

边框顶部：5px纯绿；边框底部：5px纯绿色

---

您应该将此样式直接放在

上，而不是在其周围环绕一个div。

您可以指定

右边框

左边框

。。。单独进行。

仅是以下情况：

<h3 style="background-color:red; padding:2% 0 2% 0; border-top:5px solid green; border-bottom: 5px solid green;">
This is a header
</h3>

这是一个标题

您可以使用

左边框

、

右边框

、

上边框

和

下边框

属性为容器的每一侧指定不同的边框样式

---

在您的情况下，您希望将样式应用于

边框顶部

和

边框底部

您可以这样指定边框：

<h3 style="background-color:red; padding:2% 0 2% 0; 
           border-top:5px solid green; border-bottom:5px solid green">
    This is a header
</h3>

这是一个标题

您可以在css或样式标记中使用以下内容

#div-id {
width: 100px;
height: 50px;
border-style: solid;
border-width: 1px 0;
border-color: #000;
}

使用边框宽度选择器可以定义各种边框厚度。这些值按top、right、bottom、left的顺序插入，速记版本是top/bottom和right/left，这就是我所使用的

例如，您可以设置一个具有4px上边框、3px右边框、2px下边框和1px左边框的div，如下所示。。。。边框宽度：4px 3px 2px 1px

---

您可以使用以下命令将顶部和底部边框设置为3px，将左侧和右侧边框设置为1px。。。。边框宽度：3px 1px

以下是一种替代方法，可避免多次定义边框属性（颜色、宽度），并允许声明类似于用于边距和填充的声明（根据要求）

与边距或填充一样，

边框样式

按顶部、右侧、底部和左侧的顺序定义。上述情况将实心边框应用于图元的顶部和底部，而不将边框应用于图元的左侧或右侧

---

使用此方法可避免在声明中创建冗余。

Nice。它适用于w3schools交互页面：我认为这是最好的解决方案，因为它避免了重复。没有速记吗？我尝试了类似于

border:5px纯绿首字母5px纯绿首字母

。它不起作用

border: 5px green;
border-style: solid none;