Question

我有以下CSS代码： -

border:5px solid grey !important;

将样式设置应用于上，下，右和上的所有边框四个维度。剩下。但我如何定义边界只适用于上，右和＆amp;剩下。无需为每个定义单独的样式？感谢

Answer 1

你可以尝试，

border:5px solid grey;
border-bottom:0px;

Answer 2

您可以定义所有尺寸边框，然后重新定义底部边框：

border:5px solid grey !important;
border-bottom:5px solid transparent !important;

此外，您可以将底部边框设置为none或0（这意味着该元素不会有底部边框）。

P.S。当您在定义边框时使用!important时，您还需要在重新定义边框时使用它。

JSFiddle

Answer 3

没有。使用此border:5px solid grey !important;速记方法无法做到这一点。

您需要按照下面提到的方式声明它们，以实现您的目标。

<强> WORKING DEMO

HTML：

<div>ABCD</div>

CSS：

div{border-width: 5px 5px 0px 5px; border-style: solid; border-color: grey;}

<强> FURTHER REFERENCE

希望这有帮助。

Answer 4

border-right:5px solid grey !important;
border-top:5px solid grey !important;
border-left:5px solid grey !important;

或其他更短的方式：

border:5px solid grey !important;
border-bottom: 0 !important;

或者您可以使用box-shadow：

 box-shadow:
 inset 5px 0   0 red, /* LEFT    */
 inset 0 0px 0 blue,   /* BOTTOM  */
 inset 0 5px 0  green,    /* TOP */
 inset -5px 0 0 yellow;   /* RIGHT   */

<强> Fiddle is here

Answer 5

只需在此代码行中指定您想要边框的区域。

border: solid grey!important;
border-width:5px 5px 0 5px!important;

Answer 6

您可以使用border-bottom：

border:5px solid grey;
border-bottom:none;

右上角的边框设置

6 个答案: