我有一个扩展我的基本 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>
汪汪一只猫
相关分类