使用React内联样式来更改占位符文本颜色

时间:2017-10-29 16:20:10

标签: css reactjs

如何使用React内联样式更改占位符文本颜色?我使用以下输入样式:

input: {
      width: '100%',
      height: '100%',
      backgroundColor: 'white',
      border: '0px',
      float: 'left',
      paddingLeft: '30px',
      ...
}

1 个答案:

答案 0 :(得分:0)

选择器和className之间只有一个空格,所以我必须这样做。

请参考https://github.com/FormidableLabs/radium/issues/712

        <Style
            scopeSelector=""
            rules={{
                '.textfield-input::placeholder': { /* Chrome, Firefox, Opera, Safari 10.1+ */
                    color: 'red',
                    opacity: 1 /* Firefox */
                },

                '.textfield-input:-ms-input-placeholder': { /* Internet Explorer 10-11 */
                    color: 'red',
                },

                '.textfield-input::-ms-input-placeholder': { /* Microsoft Edge */
                    color: 'red',
                }
            }}
        />