如何将样式添加到 base.html：Django 框架？
Posted
技术标签:
【中文标题】如何将样式添加到 base.html：Django 框架？【英文标题】：How to add style to base.html: Django framework? 【发布时间】：2021-07-24 17:32:50 【问题描述】：文件结构： 应用程序/模板/base.html app/static/css/base.css
我创建了 base.html 以包含标题，我将其导入到其他 HTML 页面以在整个网站中保持相同。我也想设置这个标题的样式，所以我试图将 base.css 链接到我的 base.html，但没有运气。 我尝试过的事情是：添加内联 css、添加外部 css、添加内部 css、清除缓存、添加块。
base.html 中的代码：
%load static%<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="% static 'static/css/base.css' %">
</head>
<body>
<nav>
<button id="myButton" >Home</button>
<button id="aboutButton" >About</button>
<button id="contactButton" >Contact</button>
</nav>
% block content %
% endblock content %
<footer>
<p>this is footer</p>
</footer>
<script type="text/javascript">
document.getElementById("myButton").onclick = function ()
location.href = "% url 'home' %";
;
document.getElementById("aboutButton").onclick = function ()
location.href = "% url 'about' %";
;
document.getElementById("contactButton").onclick = function ()
location.href = "% url 'contact' %";
;
</script>
</body>
</html>
这是我的 base.html 代码，我想将其与 base.css 链接：
.header
padding: 60px;
text-align: center;
background: #1abc9c;
color: white;
.button
background-color: #4CAF50; /* Green */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
我如何将base.html扩展到其他页面如下，
home.html 扩展了 base.html 与其他导航栏相同的导航栏：
% extends 'base.html' %
% load static %
% block content %
<html>
<head>
<title>Smooth</title>
<link rel="stylesheet" type="text/css" href="% static 'css/style.css' %">
<!--sample how my other html pages look like-->
我希望我已经很好地了解了我的文件系统是怎样的，代码在我的项目中是怎样的。 现在如何将 base.css 与 base.html 链接起来，以便我可以使用外部 css 文件设置标题中的按钮样式。
【问题讨论】：
【参考方案1】：这取决于您的设置，例如这就是我的静态文件设置的样子：
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
而我的 base.css 位于：
/project_name/static/base.css
所以你应该检查你的静态文件设置。
您也可以尝试将链接标签更改为
<link rel="stylesheet" type="text/css" href="% static 'css/base.css' %">
因为如果你的设置被配置为 /app/static/ 当你像链接静态一样
<link rel="stylesheet" type="text/css" href="% static 'static/css/base.css' %">
它正在寻找 /app/static/static/css/base.css 而不是 /app/static/css/base.css
【讨论】：
以上是关于如何将样式添加到 base.html：Django 框架？的主要内容，如果未能解决你的问题，请参考以下文章
如何在html文件中加载css文件已经在django中扩展了另一个html文件（base.html）
全局视图 (base.html) 中的 Django 动态菜单在所有模板中可见
Django - 如何在 base.html 中传递上下文？