react中的Link在css设置样式了为什么没有反应,不用类名用Link也是不行

问题遇到的现象和发生背景
用代码块功能插入代码,请勿粘贴截图
我想要达到的结果
import React, { Component } from "react";
import { Link,Route,NavLink} from "react-router-dom/cjs/react-router-dom";
import About from "./components/about/About";
import Home from "./components/home/Home";
import './App.css'
export default class App extends Component {
    render() {
        return (
            <div className="nav">
                <h2>React Router Demoh2>
                <hr />
                <div className="inside">
                    <div className="leftBox">
                        <Link className='router' to='/home'>homeLink>
                        <Link className='router' to='/about'>aboutLink>
                    div> 
                    <div className="rightBox">
                       <Route path='/home' component={Home}/> 
                       <Route path='/about' component={About}/> 
                    div>
                div>
            div>
        )
    }
}

![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/022847580866199.png "#left")


div闭合标签不对