Thêm ảnh và font và trong react app
Việc sử dụng font chữ và ảnh có trong nội dung trang web là 1 việc cần thiết phù hợp thiết kế 1 trang web đẹp về hình thức
Dưới đây là cách để import ảnh và font chữ vào web app
Đầu tiên là về font chữ :
Font chữ ta lưu tại mục src/font/static/Oswald-Bold.ttf
Tiếp theo chúng ta vào file src/css/app.css để thêm font
@font-face {
font-family: myfirsfont;
src: local('../font/static/Oswald-Bold.ttf');
}
body{
font-family: myfirsfont;
}
Vậy là xong
Tiếp theo thêm ảnh vào trong web app
Chúng ta có file ảnh tại src/image/anh_co.jpg
Tại file src/pages/index.tsx chúng ta thêm ảnh như sau
import anhco from '../image/anh_co.jpg';
<Avatar src={anhco} className='anhco' ></Avatar>
Vậy là oke