python - 如何在一行中对齐跨度
问题描述
大家好,我在 django 模板中有 div,它是由 Django for 循环创建的线,我该如何做到这一点?
我尝试添加填充,边距,但没有奏效
HTML:
<div>
{% for entries in mylist %}
<div class="ladder"> <span class="player"> {{ entries.0 }}</span> <span class="tab"> {{ entries.1 }} </span></div>
{% endfor %}
</div>
CSS:
player { margin-left: 20px;
}
.ladder{ width: 30%;
border: solid 2px blue;
margin-left: 20px;
margin-bottom: 30px;
}
.tab {
margin-left: 40%; }
https://i.stack.imgur.com/alGa7.png 我现在无法嵌入图片,所以我得到了这个链接来展示它现在的情况,我想要的是数字对齐在一行中。
解决方案
dl {
width: 100%;
overflow: hidden;
background: #ff0;
padding: 0;
margin: 0
}
dt {
float: left;
width: 50%;
/* adjust the width; make sure the total of both is 100% */
background: #cc0;
padding: 0;
margin: 0
}
dd {
float: left;
width: 50%;
/* adjust the width; make sure the total of both is 100% */
background: #dd0
padding: 0;
margin: 0
}
<dl>
<dt>Mercury</dt>
<dd>Ερμής</dd>
<dt>Venus</dt>
<dd>Αφροδίτη</dd>
<dt>Earth</dt>
<dd>Γη</dd>
</dl>
推荐阅读
- javascript - 如何在 click 函数中定位 span 的字符串?
- .net-core - 身份模型是否具有密码资源所有者流程的令牌自动刷新?
- python-3.x - 模块“statsmodels.tsa.api”没有属性“arima_model”
- android - 带有 Rg.Plugins.Popup 的 Xamarin Forms 应用程序在 Android 设备上崩溃
- java - 点击注册会导致安卓应用崩溃
- javascript - 计算具有该对象的数组中的对象和该对象的计数
- java - 微服务:Rest 模板与客户端 Jar
- ios - Swift 的生命周期图是否与我们所知道的 Objective-C 相同?
- php - MYSQL 8.0 与 PHP 5.6 的连接
- javascript - 如何将输入中的单词添加到另一个输入表单