我有一个扩展我的基本 HTML 文件的文件,该文件包含一个表单。我想为表单创建边距,并更改提交按钮和表单文本框的颜色以匹配我网站的主题。我该如何在我的 CSS 文件中执行此操作?截至目前,边距似乎不起作用,而且我也不确定如何像我之前提到的那样更改颜色。search.html 文件{% extends 'base.html' %}{%load static%} <link rel="stylesheet" type= "text/css" href="{% static 'css/form.css' %}" > <body> {% block content %} <container > <center> <form action="/searchoutput/" method="post"> {% csrf_token %} Input Text: <input type="text" name="param" required> <br><br> {{data_external}}<br><br> {{data}} <br><br> <input type="submit" value="Check for Service"> </form> </container> </center> {% endblock %} </body>表单.css 文件form { margin-top: 200px;}基础.html{%load static%}<!DOCTYPE html><html><head><title>TweetyBird</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link rel="stylesheet" type= "text/css" href="{% static 'css/main.css' %}" > <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
1 回答
汪汪一只猫
TA贡献1898条经验 获得超8个赞
在 base.html ({%block staticfiles%}) 中的 head 标签下方添加一个块标签。
现在在 search.html 中将你的 css 添加到 staticfiles 块中。
由于您扩展了 base.html,因此只有 search.html 的块内容会被 base.html 块中的内容替换
由于您的链接标记在块之外,因此 css 甚至不会被拾取。
另外最好在 base.html 中使用 body 标签而不是 search.html
添加回答
举报
0/150
提交
取消