在Chrome中输入的日期中没有占位符。如果您在devtools的设置中选中“Show shadow DOM”，您将能够检查它：

<input type="date">
  #document-fragment
    <div dir="ltr" pseudo="-webkit-date-and-time-container">
      <div pseudo="-webkit-datetime-edit">
      <span aria-help="Day" aria-valuemax="31" aria-valuemin="1" pseudo="-webkit-datetime-edit-day-field" role="spinbutton">dd</span>
      <div pseudo="-webkit-datetime-edit-text">/</div>
      <span aria-help="Month" aria-valuemax="12" aria-valuemin="1" pseudo="-webkit-datetime-edit-month-field" role="spinbutton">mm</span>
      <div pseudo="-webkit-datetime-edit-text">/</div>
      <span aria-help="Year" aria-valuemax="275760" aria-valuemin="1" pseudo="-webkit-datetime-edit-year-field" role="spinbutton">yyyy</span></div>
      <div></div>
      <div pseudo="-webkit-calendar-picker-indicator"></div>
    </div>
</input>

您可以使用它们的pseudos设置单独元素的样式（适用于Chrome Canary）：

::-webkit-datetime-edit-year-field {
  font-weight: bold;
}

多亏了现有的答案，我成功地解决了这个问题。只有当日期字段有值时，日、月和年字段才会得到aria-valuetext属性。这意味着我可以在日期字段显示默认值时对这些值进行样式设置，如下所示：

::-webkit-datetime-edit-day-field:not([aria-valuetext]),
::-webkit-datetime-edit-month-field:not([aria-valuetext]),
::-webkit-datetime-edit-year-field:not([aria-valuetext]) 
{
  color: #999;
}

从Chrome 31（可能更早）开始，aria-valuetext是“空白”而不是null。以下工作之一

::-webkit-datetime-edit-year-field[aria-valuetext=blank]
::-webkit-datetime-edit-year-field:not([aria-valuenow])

而不是：

::-webkit-datetime-edit-year-field:not([aria-valuetext])

（我没有代表对相关答案发表评论）

编辑：这不再起作用
我希望“占位符”文本是灰色的。根据@JackBradford的回答，我使用：

::-webkit-datetime-edit-text, /* this makes the slashes in dd/mm/yyyy grey */
::-webkit-datetime-edit-day-field[aria-valuetext=blank],
::-webkit-datetime-edit-month-field[aria-valuetext=blank],
::-webkit-datetime-edit-year-field[aria-valuetext=blank] {
  color: lightgrey;
}

placeholder-属性目前不受带有type="date"的输入字段支持，因此无法设置样式。看看这个有效属性列表：
w3.org: "input type=date – date input control"
因此，Chrome实际上是正确的，与Safari相反，Safari根本不关心date类型。

正如在一些评论中提到的，这些解决方案似乎都不能在最近版本的Chrome中工作，我可以验证到v94仍然是这样。正如Eli提到的，当试图选择伪元素的属性时，似乎会出现问题。
如果您不介意使用一点JavaScript来设置<input type="date" />元素的属性，那么可以使用一个简单的CSS选择器作为解决方案。
例如，我使用JavaScript在输入有值时设置data-hasvalue属性，然后使用以下SCSS。

&[type="date"]:not([data-hasvalue]):not(:invalid):not(:focus) {
    &::-webkit-datetime-edit-text,
    &::-webkit-datetime-edit-day-field,
    &::-webkit-datetime-edit-month-field,
    &::-webkit-datetime-edit-year-field {
      color: rgb(117, 117, 117); // Chrome's default color for input placeholder text
    }
  }

确保为所有日期输入设置data-hasvalue属性，否则在设置值时将获得占位符样式文本。或者，选择相反的行为，只在值为而不是设置时才定位。

我的2023解决方案
占位符具有不同的样式，只要值为空且未聚焦

input[type=date]:invalid {
  color: lightgray;
}

input:focus::-webkit-datetime-edit {
  color: initial;
}

<input type="date" required />