我有一个Header功能组件,并将div分配给Header className。该div有背景图片,但没有渲染。开发工具告诉我div未分配Header className。我究竟做错了什么?提前致谢!
我检查过的内容: •如果导入了CSS文件并将className分配给div。 •如果我为URL图像分配了正确的路径。 •background-size值是否应该包含或包含。 •如果background-image键应该是backgroundImage
APP.js
import React, { Component } from 'react';
import Header from './Components/Header/Header';
class App extends Component {
render() {
return (
<div>
<Header />
</div>
);
}
}
export default App;
HEADER.js
import React from 'react';
import classes from './Header.css';
const Header = () => {
return (
<div className={classes.Header}>
<p>Hello</p>
</div>
);
};
export default Header;
HEADER.css
.Header {
height: 95vh;
background-image: "url('../../Images/horseshoebend.jpg')";
background-size: cover;
background-position: top;
}
结果应显示背景图像。