CSS "couleur" vs "police-couleur"

136

Quelqu'un sait pourquoi CSS fournit colordu texte, mais n'en a pas font-colorou text-color?

Cela semble très contre-intuitif, un peu comme text-decoration: underlineplutôt que font-styleou quelque chose lié aux polices.

Est-ce que quelqu'un sait pourquoi / comment le W3C a proposé un si large éventail de noms CSS comme celui-ci?

css

— Fred Wilson
source

1

J'ai lancé une pétion pour introduire la propriété "font-color". Peut-être que certains d'entre vous aimeraient le signer. change.org/p

— ...

Vous pouvez le faire dans la balise <font>. par exemple <font color = "red"> Hello World! <font>

— airider74

@ airider74 En quelle année vivez-vous? L'élément <font> est obsolète depuis de nombreuses années.

— kojow7

Oui, il a ... mais cela fonctionne toujours

— airider74

111

Je pense qu'une des raisons pourrait être que la couleur est appliquée à des choses autres que la police. Par exemple:

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

Donne à la fois une couleur de police rouge et une bordure rouge.

Alternativement, il se pourrait simplement que les normes CSS du W3C soient complètement à l'envers et absurdes, comme en témoigne ailleurs.

— Monsieur Zimbu
source

4

Essayez d'ajouter ce qui suit au CSS sur cette page: .post-text { color: blue; border: 1px solid red; }Vous verrez que la couleur du texte est bleue même si la couleur de la bordure est rouge.

— Robusto

alors par définition, la couleur de la police est plus rapide que la couleur car elle doit faire moins de travail.

— kta

193

De la même manière que Boston a élaboré son plan de rue. Ils ont suivi les sentiers des vaches déjà là et ont construit des maisons là où les rues n'étaient pas, et au bout d'un moment, il était trop difficile de changer.

— Robusto
source

10

Je sais que c'est un ancien message, mais comme MisterZimbu l'a déclaré, la colorpropriété définit les valeurs d'autres propriétés, comme border-coloret, avec CSS3, de currentColor.

currentColor est très pratique si vous souhaitez utiliser la couleur de la police pour d'autres éléments (comme l'arrière-plan ou des cases à cocher personnalisées et des radios d'éléments internes par exemple).

Exemple:

.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>

Développer l'extrait

— quasi
source

Je pense que cela donne encore plus de raison d'avoir un séparé font-color/ text-colorPropriété. De cette façon, vous pouvez avoir de nombreuses parties de l'élément avec une couleur par défaut particulière, et le texte dans une autre si vous le souhaitez. Sinon, il lie la couleur par défaut à la couleur du texte.

— Ben J

@BenJ Lier la couleur par défaut à la couleur principale était probablement l'intention des premiers jours du Web. Aujourd'hui, vous pouvez utiliser des variables css ( developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables ) et / ou utiliser un préprocesseur css comme Sass, Less, Stylus, etc. où il est facile de travailler avec des variables.

— quasi