22-2 模板語言的進階和fontawesome字體的使用

時間 2019-11-29

標籤模板語言進階 fontawesome 字體使用简体版

原文原文鏈接

一 fontfawesome字體的使用css

http://fontawesome.dashgame.com/ 官網html

1 下載python

2 放到你的項目下面django

3 html導入這個目錄函數

實例：字體

class最前面的fa 必須寫上，第二個 wechat是圖標的名字，前面也必須加上fa，第三個fa-4x是控制圖標的大小，加上color還能夠隨意修改圖標的顏色spa

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css"> # 導入官網的的css文件
</head>
<body>
<p>
  <i style="color: green" class="fa fa-wechat fa-4x  "></i>
</p>
<i class="fa fa-hand-pointer-o"></i>

<i class="fa fa-spin fa-spinner"></i>

</body>
</html>

二模板語言的進階code

參考 https://www.cnblogs.com/liwenzhou/p/7931828.htmlorm

1 靜態文件相關的htm

通常的導入導入第三方的css或者js用的是

<link rel="stylesheet" href="/static/font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css">

它的弊端是一旦你的setting.py裏面把靜態文件的目錄給更改了，那麼你全部的html文件引用的地方都須要從新改一遍，因此能夠用模板導入，這樣你的這裏面就不用

隨着setting.py裏面的更改去更改了。

 {% load static %}
    <link rel="stylesheet" href="{% static 'font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css' %}">

2 自定義函數

2.1 必須在項目下面新建一個python package叫templatetags,而後新建一個py文件在裏面自定義你的函數

自定義一個filter函數

 1 import datetime
 2 from django import template
 3 
 4 register = template.Library()
 5 # 把我寫的函數註冊成一個自定義的filter函數，就能在模板語言裏使用了
 6 @register.filter()
 7 def alex(arg, delta="7"):
 8     try:
 9         delta = int(delta)
10     except Exception:
11         delta = 7
12         # 在原來時間基礎上加7天
13     ret = arg + datetime.timedelta(days=delta)  # 默認事件不能和int相加，可是用timedelta就能夠進行運算了
14     # 把時間對象格式化成字符串格式
15     return ret.strftime("%Y-%m-%d %H:%M:%S")

在html頁面中如何引用

{% load ooxx %} # 導入ooxx,這就是你自定義函數的py文件的名字
{#把時間轉換成字符串用內置的date#}
<p>{{ now|date:'Y-m-d H:i:s' }}</p>
{#我自定義一個alex函數#}

<p>{{ now|alex }}</p>
<p>{{ now|alex:'5'}}</p>

自定義一個simple_tag函數

# 把一個函數註冊成自定義的simple_tag
@register.simple_tag()
def gold(arg1, arg2, arg3):
    return "{}-{}-{}".format(arg1, arg2, arg3)

在html頁面引用，傳三個參數

<!--自定義simple_tag-->
<p>{% gold "燃燒" "個人" "卡路里" %}</p>

自定義一個inclusion_tag函數

# 用一些數據去填充一段HTML代碼 把HTML代碼返回給調用方
# 相似於一個簡化版的render(request, "xx.html", {})函數
@register.inclusion_tag(filename="ul.html")
def show_menu(arg): #必須傳一個參數
    ret = [i for i in range(arg)] #返回一個可迭代的對象
    return {"num": ret} # num是返回給了ul.html頁面

在寫一個ul.html頁面

<ul>
    {% for i in num %}
        <li>{{ i }}</li>
    {% endfor %}
</ul>

在去展現給用戶的html頁面去引用這個show_menu函數

{% load ooxx %}
{% show_menu 10 %}  #這裏的10就是num

simple_tag

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。