html - 格式化 HTML 表格的标准做法

标签 html css html-table

我在 HTML 页面中有一个简单的表格。没什么特别的。
格式如下:

+++++++++++++++++++++++++++++++++++++++++    
+Col1 + Col2 + Col3 + Col4 + Col5 + Col6+  
+++++++++++++++++++++++++++++++++++++++++   
+     +      +      +      +      +     +  
+     +      +      +      +      +     +  
+     +      +      +      +      +     +  
+     +      +      +      +      +     +  
+     +      +      +      +      +     +  
+     +      +      +      +      +     +  
+++++++++++++++++++++++++++++++++++++++++  

所有行都显示文本,但我遇到以下问题:
如果 Col6 一行中的内容太大,则该行将“扩展”2 行以适合该行的内容,结果其他列中的文本将分成 2 行。
例如。如果 Col2 有文本:Some-text-in-here 它变成:
一些文本
在这里
我不想那样。

我们如何解决数组的这个问题,使每一列都不会以这种方式受到其他列大小的影响?

最佳答案

您可以将 table-layout: fixed 与一些明确的表格宽度(例如 width: 100%)结合使用,使表格单元格的宽度独立于内容宽度.

您可以使用 white-space: nowrap 来防止元素中的换行。

关于html - 格式化 HTML 表格的标准做法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16488616/

相关文章:

html - 如何在 HTML 中的表格后面保留可点击链接?

html - IE7 缺少 Atom 提要自动发现

html - 使用 css 计算内联 block 元素的空间

css - Typo3:未设置填充

php - 如何从 mysql 数组的值创建 html 表

jquery - 使用 jQuery 从表 strip 化中排除嵌套表

jquery ui 可拖动约束 ina 轴 x 和给定坐标

html - 表现得像 <ul><ol>

html - Bootstrap 导航栏下拉悬停故障

jquery - 创建一个 css 类数组以使用通配符添加/删除它们