CSS "Farbe" vs. "Schriftfarbe"

136

Weiß jemand, warum CSS colorText bereitstellt , aber nicht hat font-coloroder text-color?

Scheint sehr kontraintuitiv zu sein, text-decoration: underlineeher wie font-styleoder etwas, das mit Schriftarten zu tun hat.

Weiß jemand, warum / wie das W3C auf eine so große Auswahl an CSS-Namen wie diesen gekommen ist?

css

— Fred Wilson
quelle

1

Ich habe eine Petition gestartet, um die Eigenschaft "Schriftfarbe" einzuführen. Vielleicht möchten einige von Ihnen es unterschreiben. change.org/p/…

— tsuma534

Sie können dies innerhalb des <font> -Tags tun. zB <font color = "red"> Hallo Welt! <font>

— airider74

@ airider74 In welchem Jahr lebst du? Das <font> -Element ist seit vielen Jahren veraltet.

— Kojow7

Ja, es hat ... aber es funktioniert immer noch

— airider74

111

Ich würde denken, dass ein Grund sein könnte, dass die Farbe auf andere Dinge als Schrift angewendet wird. Beispielsweise:

div {
    border: 1px solid;
    color: red;
}

Ergibt sowohl eine rote Schriftfarbe als auch einen roten Rand.

Alternativ könnte es auch sein, dass die CSS-Standards des W3C völlig rückständig und unsinnig sind, wie an anderer Stelle gezeigt wird.

— MisterZimbu
quelle

4

Versuchen Sie, dem CSS auf dieser Seite Folgendes hinzuzufügen: .post-text { color: blue; border: 1px solid red; }Sie werden sehen, dass die Textfarbe blau ist, obwohl die Rahmenfarbe rot ist.

— Robusto

dann ist die Schriftfarbe per Definition schneller als die Farbe, da weniger Arbeit erforderlich ist.

— kta

193

Auf die gleiche Weise kam Boston auf seinen Straßenplan. Sie folgten den Kuhpfaden bereits dort und bauten Häuser, in denen die Straßen nicht waren, und nach einer Weile war es zu schwierig, sich zu ändern.

— Robusto
quelle

10

Ich weiß, dass dies ein alter Beitrag ist, aber wie MisterZimbu feststellte, definiert die colorEigenschaft die Werte anderer Eigenschaften, wie border-colorund mit CSS3 von currentColor.

currentColor Dies ist sehr praktisch, wenn Sie die Schriftfarbe für andere Elemente verwenden möchten (z. B. als Hintergrund oder benutzerdefinierte Kontrollkästchen und Radios für innere Elemente).

Beispiel:

.element {
  color: green;
  background: red;
  display: block;
  width: 200px;
  height: 200px;
  padding: 0;
  margin: 0;
}

.innerElement1 {
  border: solid 10px;
  display: inline-block;
  width: 60px;
  height: 100px;
  margin: 10px;
}

.innerElement2 {
  background: currentColor;
  display: inline-block;
  width: 60px;
  height: 100px;
  margin: 10px;
}

<div class="element">
  <div class="innerElement1"></div>
  <div class="innerElement2"></div>
</div>

Erweitern Sie das Snippet

— Quasi
quelle

Ich denke, dies gibt noch mehr Grund, eine separate font-color/ text-colorEigenschaft zur Verfügung zu haben. Auf diese Weise können Sie viele Teile des Elements mit einer bestimmten Standardfarbe und den Text in einer anderen haben, wenn Sie möchten. Andernfalls wird die Standardfarbe an die Textfarbe gebunden.

— Ben J

@BenJ Das Binden der Standardfarbe an die Hauptfarbe war wahrscheinlich die Absicht in den frühen Tagen des Webs. Heute können Sie CSS-Variablen ( developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables ) und / oder einen CSS-Präprozessor wie Sass, Less, Stylus usw. verwenden, mit denen Sie problemlos mit Variablen arbeiten können.

— Quasi