mehrere Klassenstile in separaten CSS-Referenzen

Beginnen Sie das mit Ich interpretiere jemand anderes Codierung und das ist E-Mail-Codierung.mehrere Klassenstile in separaten CSS-Referenzen

Im folgenden Code wird Tabellenzelle Referenzierung .full und der Bildcode .imageblock und .icon verweist, sowie ein spezifischer .full img style in meinem CSS ist. Meine Frage ist, dass jeder Stil etwas anderes hat, also woher weiß ich, welcher zu bearbeiten ist. Außerdem gibt es in der CSS zwei .icon Referenzen. Warum sind diese getrennt und nicht zusammen? Hier

ist die Codierung:

<td width="25%" dir="ltr" class="full"> 
    <img src="https://okcu-uga.edu.185r.net/graphics/okcu-uga/JSF201920/email/icon-badge.gif" 
     width="100" 
     height="100" 
     class="imageBlock icon" /> 
</td>

Hier sind die CSS-Referenzen:

.full { display: block; width: 100%; !important} 
.full img {display:block; !important; width:30% !important; margin:0 auto !important;} 
.imageBlock {display:block !important; height:auto !important; width:100% !important;} 
.icon {padding-left:0 !important;} 
.icon {padding-left:25px;}

Quelle

2017-08-31 savvysherri

* den imageBlock Tag – savvysherri

bearbeiten .imageblock, da die Person, die Eigenschaften dieser Wähler gezwungen hat. Here is more info about CSS Specificity

und es gibt zwei .icon Regeln, weil der vorherige Entwickler keine Ahnung hatte, was er tat: p, entfernen Sie die zweite.

Quelle

2017-08-31 16:06:36 nodws

mit einer Minute des Tests bearbeitet hat, können Sie, dass b Kleinbuchstabe in imageblock und Groß in dem HTML-Code zu sehen, so sind die gezwungenen EIGENSCHAFTEN, um mir nur eine Menge debug, beacause „Ich kann nicht Holen Sie sich dieses CSS-Bit zur Arbeit " – Neil

habe nicht gesehen, bearbeiten, guten Fang – nodws

Ich habe die ursprüngliche Frage aktualisiert. Das Kleinbuchstabe "b" war ein Fehler in meiner Typisierung, aber das Duplikat .icon war es nicht. Danke für die Vorschläge. – savvysherri

Warum sind sie zwei .icon mit der gleichen Regel? vielleicht konnte der Programmierer den zweiten nicht finden und schrieb den ersten, der wichtig war, um den zweiten zu umgehen?

dann, um den Auftrag zu wissen, gibt es die magische Art und Weise mit einem Entwickler-Tool zu öffnen, wenn das img mit Chrom inspiziert, kann ich die die folgende Reihenfolge:

.full img { 
    display: block; 
    width: 30% !important; 
    margin: 0 auto !important; 
} 
.icon { 
    overwritten by important rule below---padding-left: 25px; 
} 
.icon { 
    padding-left: 0 !important; 
} 
.imageBlock { 
    display: block !important; 
    height: auto !important; 
    width: 100% !important; 
} 
img[Attributes Style] { 
    width: 100px; 
    height: 100px; 
}

wher oberen nimmt Präzedenzfall über unteren

schließlich weiß ich, es ist nicht Ihr Code, aber vermeiden Sie so viel wie Sie können! wichtig, da, wenn Sie sie wirklich brauchen, werden sie nicht funktionieren.

Quelle

2017-08-31 16:12:40 Neil

Ich habe mich gefragt, warum es zwei Verweise auf .icon gibt. Außerdem haben sie fast jede Regel als wichtig markiert. Glauben Sie, dass es etwas damit zu tun hat, dass es sich um E-Mail-Codierung handelt? Vielleicht wollten sie den E-Mail-Client richtig rendern? Danke für den Rat, obwohl das hilft. Ich habe das Gefühl, dass, während das Endergebnis der ganzen Datei nett ist, es etwas unordentliche Codierung hat. – savvysherri

mehrere Klassenstile in separaten CSS-Referenzen

Antwort

Verwandte Themen