字体族占位符离子输入Ionic5

Question

我正在尝试更改placeholder的<ion-input>字体系列。

在文档中，没有办法做到这一点，因为占位符的唯一可能选项是--placeholder-color、--placeholder-font-style、--placeholder-font-weight和--placeholder-opacity。

这是HTML：

<ion-input required 
           type="text" 
           maxlength="30"
           placeholder="Your username">
</ion-input>

我已经尝试过但没有成功：

ion-input::placeholder {
  font-family: 'My-font', sans-serif;
  --ion-font-family: 'My-font', sans-serif;
}

我试着用::placeholder代替::-webkit-input-placeholder，:-ms-input-placeholder，:-moz-placeholder。

我想要达到的目标：

ion-input {
  --placeholder-font-family: 'My-font', sans-serif;
}

Answer 1

占位符字体只是从输入字体继承。如果输入字体和占位符字体可以相同，那么只需将css样式应用于输入元素。

ion-input {
  --ion-font-family: 'My-font', sans-serif;
}