设置表格布局算法:

table
{
table-layout:fixed;
}

所有浏览器都支持 table-layout 属性。

定义

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

固定表格布局:

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

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

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

自动表格布局:

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

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

说明

该属性指定了完成表布局时所用的布局算法。固定布局算法比较快,但是不太灵活,而自动算法比较慢,不过更能反映传统的 HTML 表。

描述
automatic 默认。列宽度由单元格内容设定。
fixed 列宽由表格宽度和列宽度设定。
inherit 规定应该从父元素继承 table-layout 属性的值。

效果图:第一行使用automatic,第二行使用fixed。

CSS table-layout 属性的更多相关文章

  1. HTML+css基础 表格标签table Table标签属性 td标签属性

    表格标签table:   他是由行与列构成,最小单位是单元格. 行标签  <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...

  2. css table 布局

    使用CSS表格 CSS表格能够解决所有那些我们在使用绝对定位和浮动定位进行多列布局时所遇到的问题.例如,“display:table;”的CSS声明能够让一个HTML元素和它的子节点像table元素一 ...

  3. css常用的属性方法 上篇

    自己是从java后台自学转前端的,所以平时一些简单的css+html就不写了,列出的都是新手常用的一些属性,会持续更新,大神勿喷,留给新手做个参考! 尤其是跟我一样自学前端的.     背景关联 ba ...

  4. 关于CSS的table-layout属性的用法详解

    前言: 今天来和大家详细说一下table-layout属性的用法. /*eg:设置表格布局算法*/ table{ table-layout:fixed; } ***本文关键词:table-layout ...

  5. Android表格布局(Table Layout)

    Android表格布局(Table Layout) 先来看布局管理器之间继承关系图: 图1 可知TableLayout继承了LinearLayout,所以表格布局本质上依然是线性管理器. 表格布局采用 ...

  6. CSS中 Zoom属性

    CSS中 Zoom属性 其实Zoom属性是IE浏览器的专有属性,Firefox等浏览器不支撑.它可以设置或检索对象的缩放比例.除此之外,它还有其他一些小感化,比如触发ie的hasLayout属性,清除 ...

  7. CSS Table(表格)

    CSS Table(表格) 一.表格边框 border 指定CSS表格边框,使用border属性. 下面的例子指定了一个表格的Th和TD元素的黑色边框: table, th, td { border: ...

  8. CSS的margin属性:详解margin属性

    在网上看到的一篇文章,说的比较全面.原文地址:http://www.poluoluo.com/jzxy/201206/167007.html 你真的了解margin吗? 你知道margin有什么特性吗 ...

  9. css Table布局:基于display:table的CSS布局

    两种类型的表格布局 你有两种方式使用表格布局 -HTML Table(<table>标签)和CSS Table(display:table 等相关属性). HTML Table是指使用原生 ...

  10. css标签及属性

    css标签及属性 HTML引入CSS的方法 1.嵌入式  <style type = “text/css”>要写的样式</style> 2.外联式  <link rel ...

随机推荐

  1. Java垃圾回收概览

    GC要解决三个主要的问题: 哪些内存需要回收? 什么时候回收? 如何回收? 哪些内存需要回收? 最简单的是引用计数(reference count),缺陷是无法解决循环引用.于是更快点的算法是可达性分 ...

  2. Javascript高级编程学习笔记(17)—— 引用类型(6)基本包装类

    基本包装类 基本包装类这个概念或许有的小伙伴没有听说过 但是小伙伴们有没有想过,为什么基本数据类型的实例也有方法呢? 其实这些方法都来自基本包装类型 这是JS为了方便操作基础数据类型而创建的特殊引用类 ...

  3. Kali学习笔记15:防火墙识别、负载均衡识别、WAF识别

    防火墙简单的识别方式: 如图: 可以简单明了看出:发送SYN不回应,发送ACK回RST可以说明开启过滤等等 基于这个原理,我们可以写一个脚本来对防火墙来探测和识别: #!/usr/bin/python ...

  4. linux上安装jdk环境

    只在于安装jdk1.6.jdk1.7和jdk1.8,其他版本请绕行,目的在于方便自己和大家以后急于做jdk环境,苦于没有jdk安装包和设置变量的过程,我将安装包均放在云盘中, 需要直接在连接中找即可: ...

  5. chrome浏览器被reimage pair 劫持怎么处理

    不知道什么原因chrome浏览器被reimage pair劫持了,只要在浏览器内部一按回车,就马上进入了reimage pair下载的界面. 在网上找了很多解决方法,最后才在google的chrome ...

  6. [原创]K8uac bypassUAC(Win7/Wi8/Win10) 过46款杀软影响所有Windows版本

    [原创]K8uac bypassUAC(Win7/Wi8/Win10) 过46款杀软影响所有Windows版本 工具: k8uac编译: VC++ 作者:K8哥哥发布: 2018/11/25 1:30 ...

  7. skywalking部署

    官方文档:Setup java agent Backend and UI 下载地址:http://skywalking.apache.org/downloads/ 解压后目录 部署UI和收集器 进入w ...

  8. Struts2体系介绍

    回顾Struts2,在会用基础上重看的理解. Struts 2框架架构流程 一个请求在Struts 2框架中的处理大概分为以下几个步骤. (1) 客户端提交一个HttpServletRequest请求 ...

  9. RocketMQ源码 — 四、 Consumer 接收消息过程

    Consumer consumer pull message 订阅 在Consumer启动之前先将自己放到一个本地的集合中,再以后获取消费者的时候会用到,同时会将自己订阅的信息告诉broker 接收消 ...

  10. MFC原理第二讲.MFC的初始化过程

    MFC原理第二讲MFC的初始化过程 一丶简介 通过上一讲.我们手工模拟了一个MFC程序. 但是上一讲留下了疑问. 就是WinMain在哪.以及消息处理在哪里. 这一节主要就是讲解Winmain在哪里. ...