Rand links mit Farbe überschreibt Randradius?

Question

Ich habe eine Tabelle td mit CSS-Eigenschaften:

border-radius: 4px; 
border-left: 5px solid red; 

ich die linke Grenze will gerundet und rot werden. Aber es scheint, dass der Grenzradius nicht auf der linken Seite erscheint, wenn ich versuche, ihm eine Farbe zu geben.

Was ist der beste Weg, um dieses Problem zu lösen?

Answer 1

einfach die Reihenfolge tauschen wird dieses Problem beheben:

border-left: 5px solid red; 
border-radius: 4px; 

Dies liegt daran, border-left: alles auf die Standardwerte, einschließlich des Radius festgelegt werden.

Answer 2

Da Ihre Grenze links ist kleiner als der Radius. wenn Sie den Grenzradius 4 pc und den Rand links 5 px benutzen. Es wird für Sie nicht sichtbar sein. Machen Sie Ihren Radius größer als Rand links. Zum Beispiel

<div class="a"> 
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequatur ea dicta perferendis, error qui, nisi labore cupiditate aspernatur et, recusandae nemo itaque aliquid velit sint voluptatum alias hic amet omnis. 
</div> 

.a{ 
    border-left: 5px solid red; 
    border-radius: 3px; 
}