Ich habe zwei CSS-Klassen:CSS Styling Vorrang
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius:10px;
}
.smaller-image {
width: 100px;
border-radius:30px;
}
Verwendung in HTML-Dokument:
<img class="thick-green-border smaller-image" src="https://s3.amazonaws.com/freecodecamp/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
Wenn das Bildelement zugeordnet ist, sowohl die Klassen, die Regel für den Stil border-radius beschrieben in der Klasse .smaller-image
wird wirksam, nicht der Radius innerhalb thick-green-border
Klasse festgelegt. Das ist der Rand-Radius des Bildes wird 30px, nicht 10px.
Kann mir bitte jemand sagen warum? Ich habe versucht, die Reihenfolge zu ändern, in der die Klassen dem Bild zugewiesen sind, aber das Ergebnis ist das gleiche.
OP möchte den mit '.thick-green-border' festgelegten Grenzradius überschreiben, um nicht beide Ränder zu haben. – cHao
gut, ich missverstanden, was er –
Ich möchte die Grenze von "Dick-grün-Grenze" -Klasse festgelegt. @CHao hat das richtig gemacht. –