当前位置: 首页 > article >正文

vue-table-<td colspan=“2“>不生效

因为这里的表格没有指定表格布局算法

/*设置表格布局算法*/
2 table{
3     table-layout:fixed;
4 }

这里需要了解table-layout属性值、定义和用法、固定表格布局、自动表格布局。

1定义和用法

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

 ①该属性指定了完成表布局时所用的布局算法。

 ②固定布局算法比较快,但灵活性不强。

 ③自动布局算法比较慢,却更能反映传统的HTML表。

2固定表格布局

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

 ②其水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距、而与单元格的内容无关;

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

3自动定表格布局

 ①其列的宽度是由列单元格中没有折行的最宽的内容设定的;

 ②由于其需要在确定最终的的布局之前访问表格中的所有内容,此算法有时会需要较长时间。

4table-layout属性值

  ①automatic:(默认值)列宽度由单元格内容设定;

 ②fixed: 列宽由表格宽度和列宽度设定;

 ③inherit:规定应该从父元素继承table-layout属性的值。

如果需要使用colspan="3"来决定布局,就需要设置table-layout属性值,如下:

<table style="table-layout: fixed">
      <table class="table table-bordered"   valign="center" style="table-layout: fixed">
        <tr>
         <td colspan="2" rowspan="4" >小程序所有人</td>
          <td colspan="1">姓名/名称</td>
          <td colspan="4">李跳跳</td>
          <td colspan="1">身份证号</td>
          <td colspan="4">222222</td>
        </tr>
      </table>


http://www.kler.cn/a/463985.html

相关文章:

  • 深入Android架构(从线程到AIDL)_10 主线程(UI 线程)的角色
  • Linux 内核中的 Netlink 机制:内核与用户空间的通信桥梁
  • 自动驾驶三维重建
  • 二、CSS基础
  • 线性代数自学资源推荐我的个人学习心得
  • 设计模式 创建型 原型模式(Prototype Pattern)与 常见技术框架应用 解析
  • 100天精通Python(爬虫篇)——第113天:爬虫基础模块之urllib详细教程大全
  • Excel 后,我们需要怎样的数据分析软件
  • 基于Java+MySQL实现的(GUI)酒店管理系统(软件工程设计)
  • Spark写入HDFS数据SUCCESS文件生成控制
  • Python基于OpenCV和wxPython的人脸识别监控打卡系统【附源码】
  • 纯血鸿蒙ArkUI的网格布局详解
  • 《Java核心技术II》流中的filter、map和flatMap方法
  • [Qt] 信号和槽(1) | 本质 | 使用 | 自定义
  • 【华为OD-E卷 - 德州扑克 100分(python、java、c++、js、c)】
  • 太速科技-619-基于双FMC接口 ZU19EG 的6U VPX采集存储计算处理卡
  • 论文研读:Text2Video-Zero 无需微调,仅改动<文生图模型>推理函数实现文生视频(Arxiv 2023-03-23)
  • 机器学习之线性回归算法预测数据
  • [简单指南] 轻松将联系人从 Sony Xperia 转移到 Android
  • 无人机踏勘:革新传统勘探方式的优势与前景
  • 如何在 Ubuntu 22.04 上部署 Nginx 并优化以应对高流量网站教程
  • Qt自定义步骤引导按钮
  • Vue3入门(9)
  • macos git上传通过全局设置不上传.DS_Store
  • C++之模板进阶
  • 详细讲一讲webpack部分的配置(入口和输出配置,模块处理配置(Loader),插件配置(Plugins),优化配置, 开发服务器配置,解析配置,性能配置