javascript - 更改占位符的字体大小

Question

我正在尝试更改占位符的字体大小。所以我在下面的类中包含了字体大小，但它没有改变。

你能告诉我如何修复它，以便将来我自己修复它。

在下面提供我的代码片段和沙箱

https://codesandbox.io/s/61183rqp3w

 cssLabel: {
    "&$cssFocused": {
      color: purple[500],
      fontSize: 14
    }
  },
  cssFocused: {},
  cssUnderline: {
    "&:after": {
      borderBottomColor: purple[500],
      fontSize: 14
    }
  },
  cssOutlinedInput: {
    "&$cssFocused $notchedOutline": {
      borderColor: purple[500],
      fontSize: 14
    }
  },
  notchedOutline: {},

Answer 1

为了实现您的目标，您必须更改 InputProps 中的输入样式属性，例如:

注意:这将显示...如果占位符溢出。

const styles = theme => ({
  input: {
    "&::placeholder": {
      textOverflow: "ellipsis !important",
      color: "blue",
      fontSize: 14
    }
  }
});

和

组件应该是:

<TextField
  InputProps={{
   classes: {
     input: classes.input
   }
  }}
  variant="outlined"
  placeholder="Exp. XXXXXXXXXXXX"
/>

请在此处找到代码沙箱:https://codesandbox.io/s/9j479w189y