时间戳

首页 > 解决方案 > 无法更改字体大小

reactjs - 无法更改字体大小

问题描述

class App extends Component {

    constructor() {
        super()
        this.state = {   //state is what decribes our app
            robot: robot,
            searchfield: ''
        }
    } 

    onSearchChange = (event) =>  {
        this.setState({ searchfield: event.target.value })       
        console.log(this.state.robot);
    }  

    render() {
        const filteredRobots = this.state.robot.filter( robot => {
            return robot.name.toLowerCase().includes(this.state.searchfield.toLowerCase()); 
            })
        return(
        <div className='tc'>
            <h1>ROBOFRIENDS</h1>
            <SearchBox searchChange={ this.onSearchChange } />
            <CardList robot = { filteredRobots }/>  
        </div>
        );
    }
}

我正在尝试放大 ROBOFRIENDS 的字体大小，我尝试创建另一个用于编辑 h1 的 css 文件并尝试过

<h1 className="style:{fontSize=3em}">ROBOFRIENDS</h1>

但它们都不起作用。但是，当我尝试使用相同的方法来更改字体颜色和背景颜色时，它们就起作用了！找人可以帮我解决这个问题。

标签： reactjsnpmcomponentsfont-size

解决方案

您不能使用className道具添加样式。你有两个选择：

  • 将 a 添加className到元素并在 css 中设置 className 的样式。
  • 或添加style这样的属性：style={{ fontSize: '3em' }}

推荐阅读