2024-03-01T14:44:27.png
功能优化:

添加一个导航栏:头部放下面这段代码

<style>

.container {

        width: auto;
        background-color: rgba(255, 255, 255, 1);
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 2%;
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.09);
        border-radius: 0.75rem;
    }

    .container nav ul li {
        list-style: none;
        display: inline-block;
        padding: 20px 40px;
        color: #777;
        font-size: 18px;
        font-weight: 600;
        position: relative;
        cursor: pointer;
        z-index: 2;
    }

    .container nav ul li::after {
        content: '';
        border-bottom: 1px solid;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: -1;
        opacity: 0;
        transition: top 0.5s, opacity 0.5s;
    }

    .container nav ul li:hover::after {
        top: 50%;
        opacity: 1;
    }

    a {
        text-decoration: none;
    }

自定义内容放下面这段代码

<script>
setTimeout("TopMenu()", 500)
function TopMenu() {
    var dom = document.getElementsByClassName("hope-c-PJLV-iicyfOA-css")[0]
    var div = document.createElement("div")
    div.className = "container"
    div.innerHTML = "\
    <nav>\
        <ul>\
            <a href='https://www.baidu.com/' target='_blank'>\
                <li>百度</li>\
            </a>\
            <li>导航</li>\
            <a href='http://127.0.0.1:5244/@manage/' target='_blank'>\
                <li>管理</li>\
            </a>\
            <li>文档</li>\
            <li>关于</li>\
        </ul>\
    </nav>"
    dom.appendChild(div)
}