首页 > 其他分享 >表格中的table-layout属性讲解

表格中的table-layout属性讲解

时间:2023-08-21 14:12:56浏览次数:38  
标签:单元格 layout 表格 布局 宽度 table

定义和用法

table-layout 属性用来显示表格单元格、行、列的算法规则。

table-layout有三个属性值:auto、fixed、inherit。

  • fixed:固定表格布局

固定表格布局与自动表格布局相比,允许浏览器更快地对表格进行布局。

在固定表格布局中,水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距,而与单元格的内容无关。

通过使用固定表格布局,用户代理在接收到第一行后就可以显示表格。

如果指定了单元格的宽度,则会按指定的宽度限定每个单元格宽度,跟内容无关(如果指定的是比例,会永远保持这个比例),这样就可能出现内容飘到单元格之外的情况。

如果没有指定单元格的宽度,则会根据table的总宽度平分到每个单元格。

  • auto:自动表格布局

在自动表格布局中,列的宽度是由列单元格中没有折行的最宽的内容设定的。

此算法有时会较慢,这是由于它需要在确定最终的布局之前访问表格中所有的内容。

自动表格布局时,设置单元格的宽度是没有效的。

说明

该属性指定了完成表布局时所用的布局算法。固定布局算法比较快,但是不太灵活,而自动算法比较慢,不过更能反映传统的 HTML 表。
table表格中的内容如果是中文,一般情况下都会自动换行。但如果内容是英文或数字,内容过长时文字会飘到单元格之外,也就是内容不会自动换行,这时候需要配合属性word-wrap:break-word;和word-break:break-all;一起使用。

标签:单元格,layout,表格,布局,宽度,table
From: https://www.cnblogs.com/ZerlinM/p/17645842.html

相关文章

  • tablestore依赖问题解决
    依赖引入最新版本<dependency><groupId>com.aliyun.openservices</groupId><artifactId>tablestore</artifactId><version>5.16.0</version></dependency>执行如下方法,报错下面2个错误信息,如下图:错误一:错误二:错误原因:JavaSDK依赖2......
  • 测试使用QT来连接SQLServer并取出表格数据
    测试使用QT来连接SQLServer并取出表格数据添加引用工程文件需要加入 QT+=sql在main.cpp添加头文件引用//添加头文件#include<qdebug.h>#include<QSqlDatabase>#include<QSqlError>#include<QSqlQuery>连接数据库QSqlDatabasedb=QSqlDatabase::addDatabase("QODBC");......
  • Oracle table partition发展史
    ---Oraclepartition功能发展历程细节参考:https://www.oracle.com/docs/tech/partitioning-guide-2703320.pdf......
  • C++ const和mutable
    const和mutable这里只说const在c++中的特殊用法。用const修饰函数的成员函数。被const修饰的成员函数无法修改函数内的其他成员。可以认为这个函数变成了一个“只读”的状态。Likethis://注意const在括号后面,不要写成constxxxxx(){...}了intgetStatus()const{ returnm......
  • 将表格压缩为一行 进行统计 以供匹配
    classClass_test:def__init__(self):self.fun_5_1()#若无则报错AttributeError:'Class_test'objecthasnoattribute'fun_zip'deffun_zip(self,df_arg=pd.DataFrame(),bool_arg=False):......
  • 两步实现springBoot导出带动态表格的word docx文档
    1.第一步导入poi依赖<!--ApachePOI--><dependency><groupId>org.apache.poi</groupId><artifactId>poi</artifactId><version>4.1.2</version></dependency>......
  • pandas生成表格: 字典键值列表需对齐,而二维表格无此要求 键值需至少有一个为列表,否
    生成表格:字典键值列表需对齐,而二维表格无此要求键值需至少有一个为列表,否则需指定index,否则ValueErrordf_test=pd.DataFrame({'a':[1,2],'b':[3,None]})#生成表格:#字典键值列表需对齐,而二维表格无此要求#键值需至少有一个为列表,否则需指定index,否则ValueError:If......
  • 1. Stable Diffusion 提示词篇
    一.提示词1.正向提示词正面:(masterpiece:1.2),bestquality,masterpiece,original,extremelydetailedwallpaper,perfectlighting,(extremelydetailedCG:1.2)2.反向提示词反面:NSFW,(worstquality:2),(lowquality:2),(normalquality:2),normalquality......
  • C# Regex 获取<table></table>的html
    [Fact]publicvoidRegex_Test(){varrowHtml=@"<divclass=\""container\""><divclass=\""titledottedline\"">XXXXXX股份有限公司-受益所有人查询结果</div></di......
  • el-table 拖动排序 sortablejs
    参考:https://blog.csdn.net/glpghz/article/details/124359331官网:http://www.sortablejs.com/index.html安装cnpminstallsortablejs--save引入importSortablefrom"sortablejs";table加锚点<el-tableid="ability-table"加载后mounted()......