CSS-Element ändert keine Wirkung

Question

Normalerweise, wenn ich benutzerdefinierte CSS für eine Website schreiben, verwende ich Inspect Element, um den Inhalt bestimmter, nun, Elemente anzuzeigen. Und normalerweise füge ich einfach den Bezeichner für diese Zeile hinzu und drehe einige benutzerdefinierte Befehle wie "border: none;" aber ich finde immer wieder Elemente, die scheinbar keinen anderen Namen haben als nur "element" und aus irgendeinem Grund KEINE Änderungen, die ich an einigen dieser "Elemente" mache, funktionieren oder werden angewendet.

Zum Beispiel: Es ekelhaft weißen Ränder auf einem Tisch waren, und da ich nicht das spezifische Element zielen konnte, habe ich diese an die Spitze meines Dokuments:

* { 
    border: none !important; 
} 

Which, würde man annehmen würde Arbeit. Und sicherlich tut es das! Für alles außer dem Element, das ich ändern möchte. Ich kann immer noch nicht richtig herausfinden, wie ich dieses Element ändern soll, wenn etwas, das die gesamte Datei STILL umfasst, es nicht gewaltsam ändern kann. Kann mir das jemand erklären?

Edit:

Ich bin mir nicht sicher, was Sie von mir erwarten, Ihnen zu zeigen, da ich es hier erklärt. Diese Bilder zeigen meinen Inspektor geöffnet und Sie haben bereits über meinen benutzerdefinierten Code durch stilvolle Plugin/benutzerdefinierte CSS-Datei implementiert.

und

einfach zu wiederholen, anstatt zu sagen, „Element“ es gibt mir in der Regel einen gültigen Namen durch, wie „Tisch # zuerst“ zu gehen, und ich schrieb

* { 
    border: none !important; 
} 

gegen die Grenze, die es angewendet hat, aber es wird die Änderung nicht übernehmen. Ich stelle mir vor, dass es etwas mit dem Wichtigsten in der ursprünglichen Grenze zu tun hat, aber ich bin mir nicht sicher, was ich tun soll.

Edit:

I

hinzugefügt

table[style] { 
    border: none !important; 
} 

Was ich zur Arbeit erwartet, aber immer noch das gleiche kommt, wie wenn ich den ersten Codeblock habe ich erklärt, es kreuzt sie im Inspektor aus und wird nicht wirksam.

Answer 1

element ist die Art und Weise, wie der DOM Inspector Ihnen sagt, dass die Stile inline auf das Element selbst angewendet werden - entweder direkt im HTML oder über JavaScript.

Sie können die folgenden (inspiriert bei css-tricks.com von this post) dieses Problem umgehen, indem Sie:

/* 
You'll likely want to use a specific selector in order 
to prevent these styles from being applied to _all_ 
tables. 
*/ 

table[style] { 
    border: none !important; 
} 

Dies ist ein letzter Ausweg ist, though. Sie sollten dieses Problem ganzheitlicher angehen, indem Sie alle Inline-Stile, die nicht unbedingt erforderlich sind (z. B. basierend auf Berechnungen von JS oder etwas, das auf dem Back-End berechnet wurde) in Ihr Stylesheet verschieben, falls dies möglich ist.

Answer 2

In diesem Fall überschreibt der Inline-Stil die Stile in der CSS-Datei. Um das zu beheben, schlage ich vor, dass Sie der Tabelle eine Klasse geben und sie dann in der CSS-Datei formatieren.

btw: CSS steht für Cascading Stylesheet die Stile Was bedeutet, dass an der Unterseite kommt die Stile überschreiben, die

so wird es so etwas wie dieses html

Blick auf dem Anfang der Datei kommen:

<table class="mytable"> 
    <!-- content --> 
</table> 

css:

.mytable { 
    border: 1px solid rgb(216, 216, 216) 
    margin-top 10px; 
{ 

* { 
    border: none; 
} 

versuchen nur u wichtig als letztes Mittel, um einen Stil zu überschreiben, der nicht funktioniert