Material-UI app bar title styling

Question

is it possible to style the AppBar from Material-UI title, not inline way? I've a css file seperate and I would like to change the size of title for example.

sth like this:

.app-bar title {
    font-size: 120px !important;
}

Thank you :)

Answer 1

I solved the problem. Solution:

 <AppBar className="app-bar"
                            title={<div className="app-bar-title">Tomek The Title</div>}

and then in css file you can add styles.

Answer 2

尝试使用.app-bar h1或.app-bar *样式化CSS代码，然后将.app-bar放入AppBar组件className

Answer 3

As you can see in docs, http://www.material-ui.com/#/components/app-bar component accepts className for wrappper and have h1 tag without class, so you can try:

.app-bar h1 {
font-size: 120px !important;

}

and

<AppBar className='app-bar' />