CSS «цвет» против «цвет шрифта»

136

Кто-нибудь знает, почему CSS предоставляет colorтекст, но не имеет font-colorили text-color?

Кажется очень нелогичным, вроде как, text-decoration: underlineа не font-styleили что-то, связанное со шрифтами.

Кто-нибудь знает, почему / как W3C создал такой широкий набор имен CSS, как этот?

css

1

Я начал petion, чтобы ввести свойство "font-color". Может быть, некоторые из вас хотели бы подписать это. change.org/p/…

— tsuma534

Вы можете сделать это в теге <font>. например, <font color = "red"> Hello World! <font>

— airider74

@ airider74 В каком году вы живете? Элемент <font> устарел в течение многих лет.

— kojow7

Да, есть ... но все еще работает

— airider74

111

Я думаю, что одной из причин может быть то, что цвет применяется к вещам, отличным от шрифта. Например:

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

Выдает как красный цвет шрифта, так и красную рамку.

В качестве альтернативы, это может быть просто то, что стандарты CSS W3C являются полностью отсталыми и бессмысленными, как доказано в другом месте.

— MisterZimbu
источник

4

Попробуйте добавить следующее в CSS на этой странице: .post-text { color: blue; border: 1px solid red; }Вы увидите, что цвет текста синий, хотя цвет границы красный.

— Робусто

тогда по определению цвет шрифта быстрее, чем цвет, поскольку он должен выполнять меньше работы.

— КТА

193

Точно так же Бостон придумал свой план улиц. Они уже шли по коровьим тропам и строили дома там, где не было улиц, и через некоторое время было слишком много проблем, чтобы измениться.

— Робусто
источник

10

Я знаю, что это старый пост, но, как сказал MisterZimbu, colorсвойство определяет значения других свойств, таких как border-colorи, с помощью CSS3 currentColor.

currentColor Это очень удобно, если вы хотите использовать цвет шрифта для других элементов (например, фона или пользовательских флажков и радио внутренних элементов).

Пример:

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

Развернуть фрагмент

— квази
источник

Я думаю, что это дает еще больше оснований иметь отдельное font-color/ text-colorдоступное свойство. Таким образом, вы можете иметь много частей элемента с одним конкретным цветом по умолчанию, а текст - с другим, если хотите. В противном случае он связывает цвет по умолчанию с цветом текста.

— Бен Джей

@BenJ Привязка цвета по умолчанию к основному цвету, вероятно, была целью на заре Интернета. Сегодня вы можете использовать переменные css ( developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables ) и / или использовать препроцессор css в качестве Sass, Less, Stylus и т. Д., Где легко работать с переменными.

— квази