使用属性 table-layout:fixed 在表格中调整窗口大小时更改宽度答案

【问题标题】：change width when resize window in a table with the property table-layout: fixed使用属性 table-layout:fixed 在表格中调整窗口大小时更改宽度
【发布时间】：2019-11-09 17:53:18
【问题描述】：

我有一个表，其属性为 table-layout: fixed;当我使用javascript调整屏幕大小时，我试图改变它的宽度，将一个父元素作为参考

function setWidth() {
  var parentWidth = $('#width-ref').width();
  $('#table').width(parentWidth);
}

$(document).ready(function () { 
   setWidth();
});

$(window).resize(function () {
   setWidth();
});

#width-ref {
 table-layout: fixed;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="width-ref"></div>
<table>
 <thead>
   <th>first</th>
   <th>second</th>
 </thead>
 <tbody>
   <tr>first</tr>
   <tr>second</tr>
 </tbody>
</table>

【问题讨论】：

标签： javascript css width fixed

【解决方案1】：

删除应用于表格布局的 css 属性值“固定”并将其设为自动。

表格布局：自动；

以及从javascript动态应用宽度。

【讨论】：

改成自动工作但是破坏了表格的视觉设计，这是使用table-layout的主要原因：fixed;