Django零基礎入門之調(diào)用漂亮的HTML前端頁面
更新時間：2021年09月02日 10:09:47 投稿：jbzj
這篇文章主要介紹了Django零基礎入門之調(diào)用漂亮的HTML前端頁面的方法，本文給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下
引言：
Django如何調(diào)用HTML前端頁面呢？
Django怎樣去調(diào)用漂亮的HTML前端頁面呢?
就直接使用render方法即可！
render方法是django封裝好用來調(diào)用HTML前端模板的方法！
1.模板放在哪？
在主目錄下創(chuàng)建一個templates目錄用來存放所有的html的模板文件。（如果是使用pycharm創(chuàng)建django項目的話，默認就會自動創(chuàng)建這個目錄哦！但是用命令創(chuàng)建django項目的話是沒有此目錄的?。?/p>
templates目錄里面再新建各個以app名字命名的目錄來存放各個app中的模板文件。
2.Django中實戰(zhàn)使用——調(diào)用漂亮的HTML前端頁面
（1）App music里面的views.py文件：
from django.shortcuts import render,redirect,reverse
from django.http import HttpResponse
import time
# Create your views here.
def login(request): #登陸
return render(request,"music/test01.html") #返回HTML模板
#第二個html文件的路徑可以直接寫templates下的：因為在settings.py文件中已經(jīng)配置好了!
注意：如果是使用pycharm創(chuàng)建的django項目，templates目錄路徑是已經(jīng)添加到DIRS中了哦！
如果是使用命令創(chuàng)建的Django項目，需要你自行添加此值哦！
（2）App music里面的views.py文件：
from django.contrib import admin
from django.urls import path
from . import views
urlpatterns = [ #子路由
path("login/",views.login),
]
（3）HTML模板文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注冊界面</title>
<link rel="stylesheet" href="RESETCSS.css" rel="external nofollow" >
<style>
div{
width: 300px;
height: 350px;
border: 1px solid grey;
margin: 8px 0 0 8px;
}
span{
border-bottom: 3px solid purple;
padding-bottom: 3px;
}
a{
text-decoration: none;
float: right;
padding-top: 3px;
color: deepskyblue;
}
.first{
width: 290px;
height: 30px;
border: 1px solid grey;
border-radius: 5px;
margin: 5px 4px;
}
.second{
width: 200px;
height: 30px;
border: 1px solid grey;
border-radius: 5px;
margin: 5px 4px;
}
.third{
width: 79px;
height: 30px;
border: 1px solid blue;
border-radius: 5px;
color: blue;
}
.fourth{
width: 79px;
height: 30px;
border: 1px solid blue;
border-radius: 5px;
vertical-align: middle;
background-image: url("https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1378353400,959510337&fm=26&gp=0.jpg");
background-size: 79px 30px;
}
.zc{
width: 290px;
height: 30px;
border: 1px solid grey;
border-radius: 5px;
margin: 5px 4px;
background-color: skyblue;
color: white;
}
</style>
</head>
<body>
<div>
<form action="">
<span>請注冊</span>
<a href="">立即登錄<</a>
<hr>
<input type="text" class="first" placeholder="請輸入手機號"><br>
<input type="text" class="second" placeholder="請輸入短信驗證碼">
<input type="button" class="third" value="發(fā)送驗證碼"><br>
<input type="text" class="first" placeholder="請輸入用戶名"><br>
<input type="password" class="first" placeholder="請輸入密碼"><br>
<input type="password" class="first" placeholder="請再次輸入密碼"><br>
<input type="text" class="second" placeholder="請輸入圖形驗證碼">
<input type="button" class="fourth"><br>
<input type="submit" class="zc" value="立即注冊"><br>
</form>
</div>
</body>
</html>
（4）實現(xiàn)效果：
到此這篇關于Django零基礎入門之調(diào)用漂亮的HTML前端頁面的文章就介紹到這了,更多相關Django調(diào)用HTML頁面內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
本文我們將通過示例了解Python中*args和?**kwargs的使用方法,文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
由于Python的動態(tài)性和多功能性,它比其他語言的速度要慢.有時復雜的計算或算法需要大量時間才能在Python中執(zhí)行.因此需要跟蹤代碼的執(zhí)行流,深入了解性能瓶頸,需要的朋友可以參考下2021-06-06
年年雙十一，年年搶不到，今年小編自制Python淘寶秒殺搶購腳本，百分百中，下面小編把我的實現(xiàn)思路分享給大家，有興趣的朋友借鑒下吧2021-11-11
在本篇文章里小編給大家整理了關于通過cmd進入python的步驟和實例，需要的朋友們可以參考下。2020-06-06
我們想在Windows中運行一個Python腳本，我們可以通過CMD，首先進入python文件所在的目錄，之后運行。但是這樣很麻煩，跟著本文操作就可以解決啦2021-09-09
今天小編就為大家分享一篇python讀取Kafka實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-12-12
python使用requests庫實現(xiàn)輕松發(fā)起HTTP請求
requests是Python中一個非常流行的用于發(fā)送HTTP請求的第三方庫,它提供了簡潔的API,使得發(fā)送各種HTTP請求變得非常容易,下面我們來看看具體實現(xiàn)方法吧2025-01-01
下面小編就為大家?guī)硪黄獪\談Python 的枚舉 Enum。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
Python實現(xiàn)讀取大量Excel文件并跨文件批量計算平均值
這篇文章主要為大家詳細介紹了如何利用Python語言，實現(xiàn)對多個不同Excel文件進行數(shù)據(jù)讀取與平均值計算的方法，感興趣的可以了解一下2023-02-02
本文主要介紹了Python代碼實現(xiàn)帶難度升級的貪吃蛇，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-01-01