使用 CSS ID 设置 td 元素的宽度

Question

我正在用Django开发一个应用程序。

我正在尝试将表格最后一列的宽度设置为10像素。

因此，我尝试在td元素中包含style="width: 10 px"，并使用针对给定td元素的id属性的CSS文件。

这是我的 CSS 文件内容(我敢肯定，我的模板非常喜欢它(：

#url_cell{
width: 10px;
}

这是我的模板：

<table>
<tr style="font-weight: bold; text-align: center;width:100px">
<td class="class_Tabella_Head">Lemma</td>
<td class="class_Tabella_Head">Acronimo</td>
<td class="class_Tabella_Head">Definizione</td>
<td class="class_Tabella_Head">Titolo documento fonte</td>
<td id="url_cell" style="width: 10 px" class="class_Tabella_Head">URL documento fonte</td>
</tr>
{% for row in queryresult_key %}
<tr>        
<td class="class_Tabella_Risultati">{{ row.0 }}</td>
<td class="class_Tabella_Risultati">{{ row.1 }}</td>
<td class="class_Tabella_Risultati">{{ row.2 }}</td>
<td class="class_Tabella_Risultati">{{ row.3 }}</td>
<td id="url_cell" style="width: 10 px" class="class_Tabella_Risultati">{{ row.4 }}</td>
</tr>
{% endfor %}
</table>

Answer 1

table {
table-layout: fixed;
width: 400px;
border-collapse: collapse;
}
table tr td {
border: 1px solid;
}
table tr td:last-child {
width: 10px;
background-color: red;
}

<table>
<tr style="font-weight: bold; text-align: center">
<td class="class_Tabella_Head">Lemma</td>
<td class="class_Tabella_Head">Acronimo</td>
<td class="class_Tabella_Head">Definizione</td>
<td class="class_Tabella_Head">Titolo documento fonte</td>
<td class="class_Tabella_Head">URL documento fonte</td>
</tr>
</table>

您可以使用:last-child选择器访问列表中的最后一个元素：

table tr td:last-child { width: 10px }

更新：
正如Bryan Elliott提到的，您还需要为表格添加固定布局：

table { table-layout: fixed; }