小编Mar*_*Lau的帖子

Material-ui v1输入焦点样式覆盖

我试图通过类名overide覆盖Input组件的样式。

我尝试了以下方法:

const style = theme => ({
  input: {
    width: '20%',
    borderRadius: 4,
    backgroundColor: 'white',
    border: '1px solid #ced4da',
    fontSize: 20,
    '&:focus': {
      width: '40%',
      borderColor: '#80bdff',
      boxShadow: '0 0 0 0.2rem rgba(0,123,255,.25)',
    },
  }
});

class test extends Component {

// UI
render() {
    const {classes} = this.props
    return (
        <AppBar position="static">
            <Toolbar>
                <Input className={classes.input} />
            </Toolbar>
        </AppBar>
    );
}
}

export default withStyles(style)(test);
Run Code Online (Sandbox Code Playgroud)

谢谢

reactjs material-ui

3
推荐指数
1
解决办法
4895
查看次数

标签 统计

material-ui ×1

reactjs ×1