Django 侧边栏文本不会出现答案

【问题标题】：Django Side Bar Text Wont AppearDjango 侧边栏文本不会出现
【发布时间】：2020-09-22 01:02:14
【问题描述】：

所以我试图在我的网站上添加另一个侧边栏文本，称为“创建”，但它只显示我创建的“主页”而不是视图 IMAGE 仍在学习如何制作网站，但一点一点地学习不确定我为什么会遇到这个问题

sidenav1 是我的创建文本，而 Sidenav 是我的主页文本

<html>
<head>
    <style type="text/css">
        .sidenav {
            height:15%;
            width:1600;
            position: fixed;
            z-index:1;
            top:0;
            left:0;
            background-color:#2C3E50;
            overflow-x: :hidden;
            padding-top:20px;
        }
        .sidenav a {
            padding:6px 8px 16px 676px;
            text-decoration: none;
            font-size:25px;
            color: #2ECC71;
            display:block;

        }

        .sidenav1 a {
            padding:6px 6px 16px 696px;
            text-decoration: none;
            font-size:25px;
            color: #2ECC71;
            display:block;

        }


        .sidenav a:hover{
            color:#f1f1f1;

        }
        .main{
            margin-left:60px;
            padding: 0px 10px;
        }

        .sidenav1 a {
            padding:6px 8px 16px 676px;
            text-decoration: none;
            font-size:25px;
            color: #2ECC71;
            display:block;
        }       

    </style>
    <title>{% block title %} Habibs Website {% endblock %}</title>

</head>

</body>


<div class="sidenav">
    <a herf="/home">Home</a>
</div>

<div class="sidenav1">
    <a herf="/create">Create</a>
</div>

<div class="sidenav2">
    <a herf="/2">View</a>
</div>





<div id= "content", name="content", class="main">
    {% block content %}
    {% endblock %}
</body>
</html>

【问题讨论】：

标签： javascript python html css django

【解决方案1】：

试试这个。

<html>
<head>
    <style type="text/css">
        .nav-wrapper {
            z-index:1;
            top:0;
            left:0;
            background-color:#2C3E50;
            overflow-x: hidden;
            padding: 20px 0px;
            display: flex;
            justify-content: center;
        }
        .nav-wrapper div {
            margin: 0px 20px;
        }
        .nav-wrapper a {
            text-decoration: none;
            font-size:25px;
            color: #2ECC71;
            display:block;
        }
        .nav-wrapper a:hover{
            color:#f1f1f1;
        }
        .main{
            margin-left:60px;
            padding: 0px 10px;
        }

    </style>
    <title>{% block title %} Habibs Website {% endblock %}</title>

</head>

</body>

<div class="nav-wrapper">
    <div class="sidenav">
        <a herf="/home">Home</a>
    </div>

    <div class="sidenav1">
        <a herf="/create">Create</a>
    </div>

    <div class="sidenav2">
        <a herf="/2">View</a>
    </div>
</div>




<div id= "content", name="content", class="main">
    {% block content %}
    {% endblock %}
</body>
</html>

看起来像这样。

【讨论】：