我正在創建一個個人網站,并且我有一個用 css 和 html 完成的進度條。
為了控制進度條,我需要做的就是改變一個變數(寬度)。這是一個酒吧的代碼:
.bar-inner1 {
width: 559px;
height: 35px;
line-height: 35px;
background: #db3a34;
border-radius: 5px 0 0 5px;
}
這是受此 css 影響的相應 html:
<div class="container">
<h2 class="my-skills">My Skills</h2>
<div class="bar-1">
<div class="title">HTML5</div>
<div class="bar" data-width="65%">
<div class="bar-inner1">
</div>
<div class="bar-percent">65%</div>
</div>
</div>
我將如何使用 Django 更改可變寬度?
我瀏覽了檔案和教程,但似乎無法解決。
uj5u.com熱心網友回復:
您可以為此使用行內 CSS。只需在行內 css 中使用與在 HTML 中使用的相同。
uj5u.com熱心網友回復:
您可以使用 Django 生成進度條的初始寬度,使用背景關系資料和模板邏輯,但是一旦頁面發送到客戶端 Django 就無法再影響它了。
您必須使用 Javascript/Jquery 如果您確實需要 Django 提供的一些價值,您可以使用 Ajax ping 服務器或重繪 頁面。
uj5u.com熱心網友回復:
您可以使用行內 CSS 進行更改width,例如
<div class="container">
<h2 class="my-skills">My Skills</h2>
<div class="bar-1">
<div class="title">HTML5</div>
<div class="bar" data-width="65%">
<div class="bar-inner1" style="width: {{ progress|default:0 }}%;">
</div>
<div class="bar-percent">{{ progress|default:0 }}%</div>
</div>
</div>
在這里您應該需要div在一些'px'中設定父級的寬度,并且進度的背景顏色將根據其百分比正確
.bar{
width: 500px;
height: 35px;
background: #acacac;
border-radius: 5px 0 0 5px;
}
.bar-inner1 {
height: 35px;
background: #db3a34;
border-radius: 5px 0 0 5px;
}
如果該progress變數未在背景關系中傳遞,則應該將None其替換為0我使用了預定義的模板標簽default
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/521192.html
上一篇:Django相關模型中的pk參考
