由于它与HTML有关，因此表格用于以表格方式显示数据。关于HTML表的问题应该通过显示有问题的源代码来询问，或者，如果问题是关于根据需求创建表失败的尝试，提问者需要显示失败的尝试，描述期望和行为如何不同。
我希望我的 MudSimpleTable 布局是静态的，不改变
我的要求是希望我的表格布局是固定的。我的问题是当我在下拉框中选择值时，表格列宽度根据下拉框中所选值的长度动态变化，但我
我的表格容器内有不确定数量的表格单元格元素。 我的表格容器内有不确定数量的表格单元格元素。 <div style="display:table;"> <div style="display:table-cell;"></div> <div style="display:table-cell;"></div> </div> 是否有一种纯 CSS 方法可以使表格单元格宽度相等，即使它们内有不同大小的内容？ 我认为拥有最大宽度需要知道你有多少个单元格？ 这是一个单元格数量不确定的工作小提琴：http://jsfiddle.net/r9yrM/1/ 您可以固定每个父级div（table）的宽度，否则它将像往常一样为100%。 技巧是使用 table-layout: fixed; 和每个单元格上的一些宽度来触发它，这里是 2%。这将触发 other 表算法，浏览器会非常努力地遵守所指示的尺寸。 请使用 Chrome（以及 IE8 - 如果需要）进行测试。最近的 Safari 没问题，但我不记得这个技巧与它们的兼容性。 CSS（相关说明）： div { display: table; width: 250px; table-layout: fixed; } div > div { display: table-cell; width: 2%; /* or 100% according to OP comment. See edit about Safari 6 below */ } 编辑（2013）：当心 OS X 上的 Safari 6，它有 table-layout: fixed; 错误（或者可能只是不同，与其他浏览器非常不同。我没有校对 CSS2.1 REC 表布局；）） 。为不同的结果做好准备。 HTML <div class="table"> <div class="table_cell">Cell-1</div> <div class="table_cell">Cell-2 Cell-2 Cell-2 Cell-2Cell-2 Cell-2</div> <div class="table_cell">Cell-3Cell-3 Cell-3Cell-3 Cell-3Cell-3</div> <div class="table_cell">Cell-4Cell-4Cell-4 Cell-4Cell-4Cell-4 Cell-4Cell-4Cell-4Cell-4</div> </div> CSS .table{ display:table; width:100%; table-layout:fixed; } .table_cell{ display:table-cell; width:100px; border:solid black 1px; } 演示。 仅在 max-width: 0 元素中使用 display: table-cell 对我有用： .table { display: table; width: 100%; } .table-cell { display: table-cell; max-width: 0px; border: 1px solid gray; } <div class="table"> <div class="table-cell">short</div> <div class="table-cell">loooooong</div> <div class="table-cell">Veeeeeeery loooooong</div> </div> 更换 <div style="display:table;"> <div style="display:table-cell;"></div> <div style="display:table-cell;"></div> </div> 与 <table> <tr><td>content cell1</td></tr> <tr><td>content cell1</td></tr> </table> 查看有关尝试使 div 像表格一样执行的所有问题。他们必须添加 table-xxx 来模仿表格布局 表格在所有浏览器中都受支持并且运行良好。为什么要抛弃他们？他们必须模仿他们，这一事实证明他们很好地完成了自己的工作。 在我看来，使用最好的工具来完成工作，如果您想要表格数据或类似于表格数据表的东西就可以了。 我知道回复很晚，但值得表达。 这对每个人都有效 <table border="your val" cellspacing="your val" cellpadding="your val" role="grid" style="width=100%; table-layout=fixed"> <!-- set the table td element roll attr to gridcell --> <tr> <td roll="gridcell"></td> </tr> </table> 这也适用于通过迭代创建的表数据 这可以通过将表格单元格样式设置为 width: auto 并将内容设置为空来完成。现在，各列的宽度相等，但不包含任何内容。 要将内容插入单元格，请添加带有 css 的 div： position: absolute; left: 0; top: 0; right: 0; bottom: 0; 您还需要将 position: relative 添加到单元格中。 现在你可以将实际内容放入上面谈到的div中。 https://jsfiddle.net/vensdvvb/ 要在单元格之间使用填充并且仍然具有相同的单元格宽度，这适用于该html <div class="image-table-wrapper"> <table class="image-table"> <tr> <td width="33.3333333%"><img src="..." /></td> <td width="33.3333333%"><img src="..." /></td> <td width="33.3333333%"><img src="..." /></td> </tr> </table> </div> 如果单元格中的内边距为 5px： .image-table-wrapper { /** * To remove any overflowing border or background color * In many cases this is not necessary */ overflow-x: hidden; border: 1px solid black; /** move the border from the table to the wrapper if wanted */ } .image-table { margin-left: -5px; width: calc(100% + 10px); } .image-table td { padding-left: 5px; padding-right: 5px; } img { max-width: 100%; } 这实际上只是将外部填充移到父级之外。当表格的可见部分（例如边框或背景颜色）位于框外时，这看起来不太好。但是你可以在父级上添加 overflow-x: hidden; 给你： http://jsfiddle.net/damsarabi/gwAdA/ 不能使用 width: 100px，因为显示的是表格单元格。但是，您可以使用最大宽度：100px。那么你的盒子永远不会大于 100px。但您需要添加溢出：隐藏以确保内容不会渗透到其他单元格。如果您希望防止高度增加，您还可以添加空白：nowrap。
为什么 contenteditable="false" 不起作用？
我有一个 C.R.UD.应用程序使用 PHP 构建许多列，如下所示。这并不意味着用户可以编辑，只允许左键单击显示对话框，右键单击...
实际上我正在创建两栏的时事通讯设计，每栏分别有图像、标题和文本。目前，面临布局样式问题，我无法处理很长的时间
我想让一个表格居中，但是虽然技术上是居中的，但是td内容的长度不同使得表格右侧有一个空白区域。 。裹 { 背景：粉色； 爸...
如何使两个表的大小相同，即使列和行的数量不同。以及如何合并行与列
我有一个问题，因为我希望这两个表具有相同的大小，即使它们具有不同的列数（如图所示）。我还希望第二列的最后一行有...
Excel 文件转换为 html 表格然后设置为可编辑，但转换回 excel 文件时不会反映更改
我正在使用react并使用useState来处理变量。我还有 xlsx (SheetJS) 作为依赖项。 从 'react' 导入 React, { useState }; 从 'xlsx' 导入 * 作为 XLSX； 导出默认fu...
我想制作如下布局： 第一行 colspan:3 显示为 colspan:2 我想制作如下布局： 第一行 colspan:3 显示为 colspan:2 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> </style> </head> <body style=""> <table width=200 border="1"> <tr> <td style="background-color: red;" colspan="3">Red</td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td style="background-color: green;" colspan="2">Green</td> <td></td> </tr> <tr> <td></td> <td></td> <td style="background-color: blue;" colspan="3">Blue</td> </tr> </table> </body> </html> 我想只用 Html 来解决这个问题 可以通过增加宽度来解决，但我不想要这样。 有什么解决办法吗？ 您可以使用 table-layout CSS 属性，如下所示： table { table-layout: fixed; width: 100%; } <table border="1"> <tr> <td style="background-color: red;" colspan="3">Red</td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td style="background-color: green;" colspan="2">Green</td> <td></td> </tr> <tr> <td></td> <td></td> <td style="background-color: blue;" colspan="3">Blue</td> </tr> </table>
寻找逻辑来解决“TypeError：无法读取未定义的属性（读取'innerHTML'）”可能的空错误
我有一个函数，可以读取在 HTML 中创建的所有表格，并导出一个干净的 .xls 文件，其中包含创建的所有表格（每个表格之间有一个空格以适应风格）。执行后...
我正在使用 HTML 表格创建标记表设计。 我有这个设计 以及我创造的东西 正如您在第一行的第三列中看到的，安全、通过和总计有三列，我...
我的网站上只有一个可下载的软件，它由几个部分组成。这是付款完成后的下载页面截图—— 由于相同的产品名称重复很多...
我正在尝试编写一个 javascript 函数，该函数迭代表的行，选取修改后的输入值并在单击时构建一个管道分隔值的串联字符串。这是前任...
在表格中，我有一个“查看地址”按钮，当我单击时，它将显示地址详细信息。它工作正常，但是，由于我还是 Alpine.js 的新手，当我单击视图地址时它
在表格中，我有一个“查看地址”按钮，当我单击时，它将显示地址详细信息。它工作正常，但是，由于我还是 Alpine Js 的新手，当我单击视图地址时它
有很多类似的问题，但我能找到的每一个问题都在使用 jQuery，我想缓解这一问题。插入行的内容将动态创建。我的坏方法：
我需要一些帮助，因为我正在尝试在打开的 Outlook 电子邮件中插入筛选后的 Excel 表格。 我已经设法使用我在网上找到的函数（ExcelRangeToOutlookEmailBody）来做到这一点，但是
我的 HTML 电子邮件模板背景颜色在 Outlook 中无法正确呈现。 我使用了不同的技术但仍然不起作用。 我已将整个部分包装到表格中并应用了背景...
我正在创建一个表格来显示飞镖游戏得分。由于某种原因，即使我以像素为单位指定行高并且表格显示设置为固定，它仍然根据...调整行高大小。
我正在尝试创建一个非常具体的组件，它应该如下所示： 我给它一个带有 id、日期的数组，它应该以时间线的方式显示事件，但也以表格的方式显示......
我在 Firefox 中遇到了表格边框线 CSS 问题：当 CSS border-collapse 折叠时，我有两个合并单元格，其中一个有 1px 边框。存在额外不需要的边界线...