美文网首页
react 使用图片 和 css样式

react 使用图片 和 css样式

作者: 暴躁程序员 | 来源:发表于2022-04-03 21:02 被阅读0次

1. 使用图片

方式一:import 引入

import React from "react";
import imgLogo from "./logo.jpg";
function App() {
  return (
    <div>
      <img src={imgLogo} alt="logo" />
    </div>
  );
}

export default App;

方式二:require 引入

import React from "react";
function App() {
  return (
    <div>
      <img src={require("./logo.jpg")} alt="logo" />
    </div>
  );
}

export default App;

2. 使用 css 样式

  1. 新建 test.css
.content {
  width: 200px;
  height: 200px;
  background-color: rgb(123, 181, 233);
}
  1. import 引入外部 css 文件,通过 className 属性使用样式
import "./test.css";

function App() {
  return (
    <div>
      <div className="content">css</div>
    </div>
  );
}

export default App;

相关文章

网友评论

      本文标题:react 使用图片 和 css样式

      本文链接:https://www.haomeiwen.com/subject/utatsrtx.html