Question

在我的应用中，常用的HTML组件是样式：

POST  /line_items(.:format) line_items#create

有很多这些（100 +），它们的边框没有底部样式，颜色也不同：

.box {
  min-width: 100px;
  padding: 20px 10px;
}

...

应用程序中有一个页面，其中所有这些框都需要以全边框显示（包括底部边框） - 所需要的是删除'boder-bottom：none'定义。所以在这个特定页面中，我试图覆盖.box定义：

.box:nth-child(1) {
  border: 2px solid red;
  border-bottom: none;
}
.box:nth-child(2) {
  border: 2px solid green;
  border-bottom: none;
}
.box:nth-child(3) {
  border: 2px solid blue;
  border-bottom: none;
}
.box:nth-child(4) {
  border: 2px solid yellow;
  border-bottom: none;
}

但是这仍然没有边界。有没有办法指定一个样式，以便所有.box接受完整的边框 - 或者我必须重新定义所有底部边框？

-Dan

Answer 1

为什么不为该组件定义另一个类并为该类定义border-bottom并将其设为!important

.another_class{
 border-bottom: 1px solid #efefef !important;
}

Answer 2

border-bottom: initial;不会给你一个边框。

将第二个定义设为border-bottom: 1px solid #efefef;

CSS恢复到定义的样式

2 个答案: