gpt4 book ai didi

html - CSS DJANGO 和扩展模板

转载 作者:太空宇宙 更新时间:2023-11-04 16:02:21 24 4
gpt4 key购买 nike

我已经将 bootstrap 加载到我的 base.html 模板中,该模板扩展了我的所有其他模板

<!DOCTYPE HTML>
{% load staticfiles %}
{% load render_table from django_tables2 %}
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="{% static 'css/portal.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'django_tables2/themes/paleblue/css/screen.css' %}" />
<html>
<title>
{% block title %}Test Portal{% endblock %}
</title>
<head>
<div class="page-header">
<img src="{% static 'images/gd_logo_lg.jpg' %}" alt="GDLOGO" style="width:245;height:125px;"/>
<div id="righty">
<h1><a href="/home/">GD Portal</a></h1>
</div>
</div>
</head>

<body>
<div class="content container">
{% block content %}
{% endblock %}
</div>

</body>

</html>

我的 CSS 文件 css/portal.css 中只有一些 CSS 有效,我尝试过在线查找,但我尝试过的所有方法都不起作用。

.page-header {
background-size: cover;
background-repeat: no-repeat;
background-color: #932D42;
margin-top: 0;
padding: 10px 40px 20px 40px;
}

.page-header img {
position:absolute;
top:0px;
left:0px;
}

.righty {
float:right:
}

.page-header h1, .page-header h1 a, .page-header h1 a:visited, .page-header h1 a:active {
color: #ffffff;
font-size: 32pt;
font-family: "Courier New", monospace;
font-weight: bold;
text-decoration: none;


h1, h2, h3, h4 {
font-family: 'Impact', Sans-serif;
}

例如,page-header 工作正常,我可以更改它并做我想做的,但是 righty 没有任何影响。我在扩展模板中尝试的任何 CSS 也不起作用。

有人可以解释我做错了什么,因为我觉得我缺少一些非常基本的东西吗?

最佳答案

您需要了解如何按 id 或按类选择元素。在你的 html 文件中:

<div id="righty">
<h1><a href="/home/">GD Portal</a></h1>
</div>

但是你的 css 有这样的代码:

.righty {
float:right;
}

"div"有 id 属性为 righty.So 在 css 中,确切的代码应该是:

<style>
#righty {
float:right;
}

</style>

对于 id,css 和 Javascript 元素选择器是 #,对于类,它是简单的点 (.)。

如果还是不行,使用这段代码:

<style>
.righty {
text-align: right !important;
}

</style>

关于html - CSS DJANGO 和扩展模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41058774/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com