ustawienie prawej górnej granicy lewy

Question

Mam następujący kod CSS: -

border:5px solid grey !important; 

który zastosuje ustawienia stylu dla całej granicy cztery wymiary górny, dolny, prawy & lewo. ale w jaki sposób mogę zdefiniować granicę, aby zastosować ją tylko do górnej, prawej po lewej stronie: &. bez konieczności definiowania osobnego stylu dla każdego? Dzięki

Answer 1

No. To nie jest możliwe, z tym border:5px solid grey !important; skróconej metodologii.

Musisz zadeklarować je w sposób opisany poniżej, aby osiągnąć to, czego szukasz.

WORKING DEMO

HTML:

<div>ABCD</div> 

CSS:

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

FURTHER REFERENCE

Mam nadzieję, że to pomoże.

Answer 2

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

lub inny krótsza droga:

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

lub można wykorzystać 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 3

Można zdefiniować do wszystkich wymiarów granicy a następnie przedefiniować granicę do dołu:

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

Ponadto można ustawić dolną granicę do none lub 0 (te środki, które nie będą miały elementem dolną granicę).

P.S. Podczas definiowania obramowania przy użyciu !important należy użyć go również do ponownego zdefiniowania obramowania.

JSFiddle

Answer 4

Można spróbować,

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

Answer 5

Po prostu określ obszar, który chcesz obramować w tym wierszu samego kodu.

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

Answer 6

Można użyć border-bottom:

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