如何使用 CSS 使 TD 表现得像 TR(row)? [英] How to make TD behaving like TR(row) with CSS?

问题描述

我有一个动态创建 html 表格的组件.根据我的需要，我需要将 td 标签逐行显示为块元素，而不是列.如何使用 CSS 做到这一点?

I have a component that create dynamically html table. According to my need, I need to show td tags line by line as a block element not like column. How to do that by using CSS ?

推荐答案

您可以通过将 display: block 应用到 tds:

You can do this by applying display: block to the tds:

http://jsfiddle.net/wYA9K/

这适用于除 IE9 之外的所有现代浏览器..

That works in all modern browsers except IE9..

使用 float: left;width: 100% 反而使它在 IE8/9 中也能工作:

Using float: left; width: 100% instead makes it also work in IE8/9:

http://jsfiddle.net/gvpzh/

没有什么可以使它在 IE7 中工作.

Nothing will make it work in IE7.

这篇关于如何使用 CSS 使 TD 表现得像 TR(row)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！