如何用CSS控制表格每列的宽度？

如果是简单的表格，直上直下没有跨列或者跨行的：\x0d\x0atd { text-overflow:ellipsiswhite-space:nowrapoverflow:hidden} /* 设置不换行 省略号显示*/\x0d\x0a\x0d\x0a然后只需要再给第一行的td分别加上class，例如：\x0d\x0a\x0d\x0a 单元格\x0d\x0a 单元格\x0d\x0a 单元格\x0d\x0a 单元格\x0d\x0a 单元格\x0d\x0a 单元格\x0d\x0a\x0d\x0a然后，分别设置宽度\x0d\x0a.item1 { width:20% }\x0d\x0a....\x0d\x0a.item6 { width:5% }\x0d\x0a其他行同列的单元格会被撑开\x0d\x0a\x0d\x0a比较复杂的有跨列或者跨行的表格，设置方法类似，但是就是要计算一下，比较麻烦。 回答于 2022-11-16 抢首赞 已踩 0 查看全部1个回答 — 为你推荐更多精彩内容 — 正在加载 加载失败 点击重新加载

微信

微博

QQ

QQ空间

答案纠错

举报

取消 赞赏答主 5 10 50 100 200

已赞赏0财富值

合计：0 财富值

登录后赞赏 选择举报类型 侵犯版权 色情低俗 涉嫌违法犯罪 时政信息不实 垃圾广告 低质灌水 工作人员会在48小时内处理,处理结果请关注系统通知,感谢您对百度知道的支持。 确定 void function(a,b,c,d,e,f){function g(b){a.attachEvent?a.attachEvent("onload",b,!1):a.addEventListener&&a.addEventListener("load",b)}function h(a,c,d){d=d||15var e=new Datee.setTime((new Date).getTime()+1e3*d),b.cookie=a+"="+escape(c)+"path=/expires="+e.toGMTString()}function i(a){var c=b.cookie.match(new RegExp("(^| )"+a+"=([^]*)(|$)"))return null!=c?unescape(c[2]):null}function j(){var a=i("PMS_JT")if(a){h("PMS_JT","",-1)try{a=a.match(/{["']s["']:(\d+),["']r["']:["']([\s\S]+)["']}/),a=a&&a[1]&&a[2]?{s:parseInt(a[1]),r:a[2]}:{}}catch(c){a={}}a.r&&b.referrer.replace(/#.*/,"")!=a.r||alog("speed.set","wt",a.s)}}if(a.alogObjectConfig){var k=a.alogObjectConfig.sample,l=a.alogObjectConfig.randd="https:"===a.location.protocol?"https://fex.bdstatic.com"+d:"http://fex.bdstatic.com"+d,k&&l&&l>k||(g(function(){alog("speed.set","lt",+new Date),e=b.createElement(c),e.async=!0,e.src=d+"?v="+~(new Date/864e5)+~(new Date/864e5),f=b.getElementsByTagName(c)[0],f.parentNode.insertBefore(e,f)}),j())}}(window,document,"script","/hunter/alog/dp.mobile.min.js") window.tt = 1680951623

想要使用CSS将div元素的内容分成多列来显示，可以使用columns属性。columns属性一个简写属性，可以设置列数和列宽，用于设置分栏模块。下面本篇文章就来给大家介绍一下columns属性，希望对大家有所帮助。

columns 属性是一个简写属性，一次可以采用多个值；用于设置列宽和列数。

语法：

属性值：

●　auto： 这会将列宽和列计数值设置为其浏览器默认值。

示例：

效果图：

注意：如果未指定column-width和column-count中的任何值，则浏览器默认将其值设置为auto。

●　column-width和columns-count ：用于使用整数值指定列宽和列数。

效果图：

浏览器支持：

●　Chrome 50.0, 4.0 -webkit-

●　Edge 10.0

●　Firefox 52.0, 9.0 -moz-

●　Safari 9.0, 3.1 -webkit-

●　Opera 37.0, 15.0 -webkit- 11.1

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<table>标签中的第一个<td>标签，加入属性代码：width="65px"。

3、浏览器运行index.html页面，此时表格第一列的宽度被固定在65像素。

---