如何使CSS宽度属性等于数学表达式的结果

Question

我试图使宽度属性等于，(100/3)%因为我试图将宽度均匀地划分为 3 列。但显然这不是有效的 css。实现这一目标的正确方法是什么？

Answer 1

calc是要走的路。只需确保运算符和操作数之间留有空格即可。// This is correct.class {  width: calc(100% - 5px);}// This produces an error.class {  width: calc(100%-5px);}

Answer 2

纯CSS方法：th, td {&nbsp; width: calc(100% / 7);}Javascript 方法：您可以获取表格元素并分配样式，试试这个：let th = document.getElementsByTagName('th');let td = document.getElementsByTagName('td');console.log(th, td)for(let el of th){&nbsp; &nbsp; el.style.width = (100 / 3) + 'px';}for(let el of td){&nbsp; &nbsp; el.style.width = (100 / 3) + 'px';}<table>&nbsp; <tr>&nbsp; &nbsp; <th>Firstname</th>&nbsp; &nbsp; <th>Lastname</th>&nbsp; &nbsp; <th>Age</th>&nbsp; </tr>&nbsp; <tr>&nbsp; &nbsp; <td>Jill</td>&nbsp; &nbsp; <td>Smith</td>&nbsp; &nbsp; <td>50</td>&nbsp; </tr>&nbsp; <tr>&nbsp; &nbsp; <td>Eve</td>&nbsp; &nbsp; <td>Jackson</td>&nbsp; &nbsp; <td>94</td>&nbsp; </tr></table>