font - html color




Wie erhält man die css-Hintergrundfarbe für das<tr>-Tag, um die gesamte Zeile zu überspannen? (6)

Das hat für mich funktioniert, sogar innerhalb eines Div:

      div.cntrblk tr:hover td {
        line-height: 150%;
        background-color: rgb(255,0,0);
        font-weight: bold;
        font-size: 150%;
        border: 0;
      }

Es hat die gesamte Reihe ausgewählt, aber ich möchte, dass die Kopfzeile nicht ausgeführt wird. Ich habe mir das noch nicht angeschaut. Die Schriftarten, die mit dem Schwebeflug nicht skaliert werden konnten, wurden teilweise behoben. Anscheinend müssen Sie Einstellungen auf die Zelle anwenden, nicht auf die Zeile, sondern wählen Sie alle Komponentenzellen mit dem tr: hover aus. Ein, um das in-konsistente Problem bei der Schriftskalierung zu ermitteln Schön, dass CSS dies tun wird.

Ich habe alles versucht, woran ich in css denken kann, um eine Hintergrundfarbe zu erhalten, die eine ganze Tabellenzeile umfasst (<tr> -Tag). Aber ich bekomme immer einen weißen Rand um jede Zelle.

CSS (Auszug):

/*alternating row*/
table, tr, td, th {margin:0;border:0;padding:0;}
tr.rowhighlight {background-color:#f0f8ff;margin:0;border:0;padding:0;}

HTML (Auszug):

<tr class="rowhighlight"><td>A</td><td>B</td><td>C</td></tr>

Es will einfach nicht kooperieren. Danke fürs Helfen...


Durch das Entfernen der Ränder sollte die Hintergrundfarbe ohne Lücken zwischen den Zellen gezeichnet werden. Wenn Sie sich dieses jsFiddle genau ansehen , sollten Sie feststellen , dass sich die hellblaue Farbe ohne weiße Lücken über die Reihe erstreckt.

Wenn alles andere fehlschlägt, versuchen Sie Folgendes:

table { border-collapse: collapse; }

Haben Sie versucht, den Abstand auf Null zu setzen?

/*alternating row*/
table, tr, td, th {margin:0;border:0;padding:0;spacing:0;}
tr.rowhighlight {background-color:#f0f8ff;margin:0;border:0;padding:0;spacing:0;}

Ich bevorzuge die Verwendung von border-spacing da dies mehr Flexibilität ermöglicht. Zum Beispiel könnten Sie tun

table {
  border-spacing: 0 2px;
}

Das würde nur die vertikalen Ränder zusammenbrechen lassen und die horizontalen Grenzen im Takt lassen, was sich anhört, als würde das OP eigentlich suchen.

Beachten Sie, dass border-spacing: 0 nicht dasselbe ist wie border-collapse: collapse . Sie müssen das letztere verwenden, wenn Sie, wie hier gezeigt, einen eigenen Rand zu einem tr hinzufügen möchten.


table{border-collapse:collapse;}

tr.rowhighlight td, tr.rowhighlight th{
    background-color:#f0f8ff;
}




background-color