javascript 导航栏图像未显示

ymdaylpp  于 2022-11-27  发布在  Java
关注(0)|答案(1)|浏览(126)

我有一个奇怪的问题,我的导航栏的图像没有显示,我不知道为什么。我试过玩不同的大小和图像,但不是什么都只显示alt消息。而且它应该链接到正确的目录。如果有人可以看看代码和帮助,我会很高兴。

The JSX

import React from 'react';
import { NavLink } from 'react-router-dom';
const Navbar = () => (

export default Navbar;
 ```

  And the CSS
  ```
 .img-user {
  width: 50px;
  }

 * {
 box-sizing: border-box;
   }
 
 .nav-link {
 color: #121212 !important;
 font-size: 1.413rem;
 font-weight: 400;
 letter-spacing: 1.9px;
 }

  .body {
  margin: 0;
  }

 .navbar {
 height: 60px;
 top: 30px;
 display: flex;
 flex-direction: row;
 align-items: center;
 gap: 50px;
  padding: 3rem 6rem;
  border: 1px solid whitesmoke;
  background-color: #f8f8f8;
   }

  .navbar a {
  color: #fff;
  text-decoration: none;
  align-items: center;
  gap: 2rem;
 padding: 0 1rem;
   height: 100%;
 display: flex;
 }        

.navbar ul {
display: flex;
list-style: none;
margin: 0;
padding: 0;
gap: 20px;
}

.navbar li {
font-size: 1.413rem;
font-weight: 400;
color: darkgray;
}

.logo {
font-size: 2.875rem;
font-weight: 900;
color: #d51284;
}

```

我已经尝试了一切不同大小不同的图标,但没有显示出来。
kq0g1dla

kq0g1dla1#

假设您的图像文件夹位于公共目录中,请将路径指向图像,如下所示:

<img src="./images/user.png" alt="profile" className="img-user" />

(Don不要用两个..只要一个。)

相关问题