Django模板（扩展有问题的CSS）_Css_Django_Templates

Django模板（扩展有问题的CSS）

css django templates

Django模板（扩展有问题的CSS）,css,django,templates,Css,Django,Templates,我有两个模板。index.html（父级）和test.html（子级）我有一个固定在页面顶部的DIV，就像一个条[#TopBar]。它停留在父模板上，但是一旦它到达子模板，它就坚持添加某种填充或边距，并且它的顶部有几个像素我试图在子模板中过度隐藏css，但仍然没有成功。我停止使用模板，并创建了两个完整的HTML文件，这是可行的（我不想这样做，因为我正在复制HTML代码）。因此，似乎每次我在子模板上放置{%extends“crm/index.html”%}时，它都会填充内容这是我的密码：父

我有两个模板。index.html（父级）和test.html（子级）

我有一个固定在页面顶部的DIV，就像一个条[#TopBar]。它停留在父模板上，但是一旦它到达子模板，它就坚持添加某种填充或边距，并且它的顶部有几个像素

我试图在子模板中过度隐藏css，但仍然没有成功。我停止使用模板，并创建了两个完整的HTML文件，这是可行的（我不想这样做，因为我正在复制HTML代码）。因此，似乎每次我在子模板上放置{%extends“crm/index.html”%}时，它都会填充内容

这是我的密码：

父-index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>{%block title%}Control Panel {%endblock%}</title>

<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}crm/crm.css" />

</head>

<body>

    <div id="TopBar"  >
        <div id="header">
            <h1> TITLE</h1>
        </div>

        <div id="searches" >
            <input type="text" id="search" name="search" /> <input type="button" value="submit" />
        </div>
    </div>

    <div id="LeftCol">
        <div id="LeftMenu">
            <h3>MENU</h3>

        </div>
    </div>

    <div id="RightCol">
        <div id="UserProfile">

            {% block content %}
            <h1 class="profile"> USER PROFILE</h1>
            <p>Random text</p>
            {%endblock%}    
        </div>
    </div>

</body>

</html>

我只想更改{%block content%}中的内容。我没有理由在块中放置其他div

这是我从浏览器获得的输出（右键单击，查看源）：

index.html：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title> Control Panel </title>
    <link rel="stylesheet" type="text/css" href="/static/crm/crm.css" />
</head>
<body>

    <div id="TopBar"   >
        <div id="header">
            <h1>Control Panel</h1>

        </div>

        <div id="searches" >
            <input type="text" id="search" name="search" /> <input type="button" value="submit" />
        </div>
    </div>

    <div id="LeftCol">
        <div id="LeftMenu">
            <h3>MENU</h3>


        </div>
    </div>

    <div id="RightCol">
        <div id="Contents">


            <h1 class="profile"> USER PROFILE</h1>
            <p>Random text</p>      
        </div>
    </div>

</body>

</html>


控制面板
控制面板
菜单
用户配置文件
随机文本

test.html：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title> Test  </title>
    <link rel="stylesheet" type="text/css" href="/static/crm/crm.css" />
</head>
<body>

    <div id="TopBar"   >
        <div id="header">
            <h1>  Test</h1>

        </div>

        <div id="searches" >
            <input type="text" id="search" name="search" /> <input type="button" value="submit" />
        </div>
    </div>

    <div id="LeftCol">
        <div id="LeftMenu">
            <h3>MENU</h3>


        </div>
    </div>

    <div id="RightCol">
        <div id="Contents">


         <h1 class="profile"> test</h1>

         <p> hkhksjhgkdhskghdk</p>

        </div>

    </div>

</body>

</html>


测验
测验
菜单
测验
HKSJHGKDHSKGHDK

我认为这不是django的问题，扩展模板似乎是正确的。。也许您可以在浏览器中访问视图时发布index.HTML和test.HTML的完整HTML输出…

尝试使用它删除大量边距和填充。它可能无法解决您的问题，但通常会有很大帮助

我现在将它添加到原来的问题中。刚才尝试过，仍然没有区别。谢谢你的努力

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title> Control Panel </title>
    <link rel="stylesheet" type="text/css" href="/static/crm/crm.css" />
</head>
<body>

    <div id="TopBar"   >
        <div id="header">
            <h1>Control Panel</h1>

        </div>

        <div id="searches" >
            <input type="text" id="search" name="search" /> <input type="button" value="submit" />
        </div>
    </div>

    <div id="LeftCol">
        <div id="LeftMenu">
            <h3>MENU</h3>


        </div>
    </div>

    <div id="RightCol">
        <div id="Contents">


            <h1 class="profile"> USER PROFILE</h1>
            <p>Random text</p>      
        </div>
    </div>

</body>

</html>

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title> Test  </title>
    <link rel="stylesheet" type="text/css" href="/static/crm/crm.css" />
</head>
<body>

    <div id="TopBar"   >
        <div id="header">
            <h1>  Test</h1>

        </div>

        <div id="searches" >
            <input type="text" id="search" name="search" /> <input type="button" value="submit" />
        </div>
    </div>

    <div id="LeftCol">
        <div id="LeftMenu">
            <h3>MENU</h3>


        </div>
    </div>

    <div id="RightCol">
        <div id="Contents">


         <h1 class="profile"> test</h1>

         <p> hkhksjhgkdhskghdk</p>

        </div>

    </div>

</body>

</html>