CSS table-layout属性,设置表格布局

table-layout属性

CSS中的table-layout属性,可以用于设置单元格、行和列的布局算法。


语法

table{ table-layout: value}

可选属性值

属性值描述
automatic默认值,表格列宽度、单元格宽度将依据内容设置
fixed固定表格布局,表格列宽将根据表格宽度和列宽度设置,而不是单元格内的内容
inherit从父元素继承table-layout属性值

table-layout属性实例代码,及在线编辑器

<table border='1' id='t1'>
  <tr><td>PHP</td><td>C</td><td>C++</td><tr>
  <tr><td>C#</td><td>Java</td><td>R</td><tr>
</table>
<br>
<table border='1' id='t2'>
  <tr><td>CSS</td><td>HTML</td><td>JavaScript</td><tr>
  <tr><td>Python</td><td>Golang</td><td>VisualBasic</td><tr>
</table>

<style>
  #t1{table-layout: automatic;}
  #t1 td{width:33%;}
  #t2{table-layout: fixed}
  #t2 td{width:33%}
</style>

全栈前端 / CSS教程 :



























Copyright © 2022-2024 笨鸟工具 x1y1z1.com All Rights Reserved.