一些實用的Django+HTML設置

来源:https://www.cnblogs.com/monlecaso/archive/2019/12/04/11983190.html
-Advertisement-
Play Games

一、關於引入變數 1.變數引入方法: {% block 塊名稱 %} <p>{{變數名}}<p> {% endblock %} 2.引入變數的值中標簽是否轉義: 不轉義: {% autoescape off %} ...HTML代碼... {% endautoescape %} 轉義: {% aut ...


一、關於引入變數

1.變數引入方法:

{% block 塊名稱 %}

<p>{{變數名}}<p>

{% endblock %}

 

2.引入變數的值中標簽是否轉義:

不轉義:

{% autoescape off %}

...HTML代碼...

{% endautoescape %}

 

轉義:

{% autoescape on %}

...HTML代碼...

{% endautoescape %}

 

或者部分不轉義部分轉義:

{% autoescape off %}

...HTML代碼...

{% autoescape on %}

...HTML代碼...

{% endautoescape %}

 

 

二、表格數據水平+垂直居中

<td style="text-align:center;vertical-align:middle;margin:auto">表格數據</td>

 

 

三、表格列名跨行顯示

使用 rowspan/colspan 屬性,代表占用多少行/列,以下為代碼和效果圖

代碼:

<table border="1" summary="this table gives some statistics about fruit
   flies: average height and weight, and percentage
     with red eyes (for both males and females).">
    <caption>
        <em>
            A test table with merged cells.
        </em>
    </caption>
    <tbody>
        <tr>
            <th rowspan="2">Gender&nbsp;</th>
            <th colspan="1">Max</th>
            <th colspan="1">Min</th>
            <th rowspan="2">Rate</th>
        </tr>
        <tr>
            <th>Height</th>
            <th>Weight</th>
        </tr>
        <tr>
            <td>Male</td>
            <td>1.9</td>
            <td>100</td>
            <td>40%</td>
        </tr>
        <tr>
            <td>Female</td>
            <td>1.7</td>
            <td>88</td>
            <td>43%</td>
        </tr>
    </tbody>
</table>
<p>

 

簡化的效果圖:

 

 

 

 

 

 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 作為JavaScript開發人員,NPM是我們一直使用的東西,並且我們的腳本在終端上連續運行。 如果我們可以節省一些時間呢? 1、直接從npm打開文檔 如果我們可以直接使用npm跳轉到軟體包的文檔怎麼辦? 2、打開bug頁面 為了以防萬一,我們想在程式包上提交一個錯誤。 如果有這個包的作者的鏈接,將 ...
  • 在web開發時,可能經常會用到sessionstorage存儲數據,存儲單個字元串數據變數時並不困難 var str = 'This is a string'; sessionstorage.setItem('param',str); 獲取sessionstorage var item = sess ...
  • js Brendan(布蘭登) Eich 輕量級的編程語言(ECMAscript5或6), 是一種解釋性腳本語言(代碼不進行預編譯), 主要用來向HTML頁面添加交互行為, 目前是互聯網上最流行的腳本語言, 支持面向對象、命令式和聲明式(如函數式編程)風格, JavaScript,他和Python一 ...
  • 事故起源於一個魔鬼測試人員,某天做網站UI優化的時候,突然甩了一個問題給我 第二列的數據是可以跳轉至其他頁面的,但是,魔鬼測試的電腦上,一直都有一條數據是與其他的樣式不同,於是便甩了這個問題給我,我一瞅,喲呵,還真是,而且不管如何F5,Ctrl + F5,都不能改變它變黑的事實,一時間都不敢回消息了 ...
  • 從輸入URL到頁面載入發生了什麼? 最近在進行前端性能優化方面的一些工作,發現前端性能方面太廣,不知道如何下手。參考了許多文章,發現最終都會歸咎於一個非常經典的問題: 從輸入URL到頁面載入發生了什麼? 通過連接這個過程,然後針對性地對每個過程進行優化,最終實現的就是我們的前端性能優化。本篇文章主要 ...
  • 一、解決什麼問題 1、開發環境js、css不壓縮,可在瀏覽器選中代碼調試 2、開發環境運行http服務指向打包後的文件夾 3、babel輸出瀏覽器相容的js代碼 二、需要安裝的包 babel-loader:輸出瀏覽器相容的js代碼;命令:<!--?xml version="1.0" encoding ...
  • At a Glance Script tags have access to any element which appears before them in the HTML. jQuery.ready / DOMContentLoaded occurs when all of the HTML ...
  • 目錄 Table of Contents generated with "DocToc" "目錄" "一、參考書籍和數據" "二、原型,[[prototype]]和.prototype以及constructor" "三、原型鏈" "for...in和in操作符" "四、屬性設置和屏蔽" "五、Jav ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...