本文主要包含lt,gt,style,table,width等相关知识,匿名希望在学习及工作中可以帮助到您
我想用一个列表布局输出一系列信息，第一列是序号，第二列是图片，第三列要求文本左对齐。第四列是链接按钮。
我的代码如下：
问题1：我注意到h5不支持col标签中的align属性定义左对齐，可是我写在style里也不起作用，如何实现？难道非得在每个th标签里加style="text-align: left"吗？
问题2：我查到其他的解决方案是给第三个col添加左浮动的样式，可是这样一来第三列第四列的大小又变了，第四列的位置也变了..........
问题3：是不是这种布局最好不要用table标签来实现？我看到很多类似的布局都是用各种div、设浮动实现的。但是table比起他们来说有自动垂直居中、排布简单的优点，又让我不忍放弃...
首先，CSS Selectors 4 可以这样：
col.left-aligned || td { text-align: left }
或
td:nth-column(odd) { text-align: left }
不过目前为止（2016年4月），没有任何一款浏览器支持“||”combinator和nth-column伪类等特性。
下面谈点历史：
之所以直接在 col 上定义样式无效，是一个老问题了。实际上HTML4定义的col上的align属性在现代浏览器上从来没有得到过良好支持（只有始于CSS时代之前的IE支持），原因很简单，因为此设计在CSS1、2乃至3的机制中都无法实现。
按照CSS的模型，一个元素上的CSS样式值要么来自于匹配了自己的规则，要么来自于匹配了祖先元素的规则然后通过继承获得。所以一个cell（td/th）的text-align，要么来自于匹配td/th的规则，要么来自于tr,tbody,table等祖先元素。而col/colgroup不可能是其祖先元素。
因此尽管这个需求被开发者要求了十多年，但是始终未能满足。最终还是需要通过更新CSS规范，创造新的combinator和伪类来实现。
下面谈你这个需求：
一、table元素应该用于真的表格，所谓真的表格即二维数据表。从你的需求来看，其实并不像是真的数据表。因此不建议用table元素。
二、其实你可以使用 nth-child 来实现你要的效果。
以上。
我的代码如下：
| 1 |  | 我是一个字符串 |
|---|
问题1：我注意到h5不支持col标签中的align属性定义左对齐，可是我写在style里也不起作用，如何实现？难道非得在每个th标签里加style="text-align: left"吗？
问题2：我查到其他的解决方案是给第三个col添加左浮动的样式，可是这样一来第三列第四列的大小又变了，第四列的位置也变了..........
问题3：是不是这种布局最好不要用table标签来实现？我看到很多类似的布局都是用各种div、设浮动实现的。但是table比起他们来说有自动垂直居中、排布简单的优点，又让我不忍放弃...
回复内容：
谢邀。首先，CSS Selectors 4 可以这样：
col.left-aligned || td { text-align: left }
或
td:nth-column(odd) { text-align: left }
不过目前为止（2016年4月），没有任何一款浏览器支持“||”combinator和nth-column伪类等特性。
下面谈点历史：
之所以直接在 col 上定义样式无效，是一个老问题了。实际上HTML4定义的col上的align属性在现代浏览器上从来没有得到过良好支持（只有始于CSS时代之前的IE支持），原因很简单，因为此设计在CSS1、2乃至3的机制中都无法实现。
按照CSS的模型，一个元素上的CSS样式值要么来自于匹配了自己的规则，要么来自于匹配了祖先元素的规则然后通过继承获得。所以一个cell（td/th）的text-align，要么来自于匹配td/th的规则，要么来自于tr,tbody,table等祖先元素。而col/colgroup不可能是其祖先元素。
因此尽管这个需求被开发者要求了十多年，但是始终未能满足。最终还是需要通过更新CSS规范，创造新的combinator和伪类来实现。
下面谈你这个需求：
一、table元素应该用于真的表格，所谓真的表格即二维数据表。从你的需求来看，其实并不像是真的数据表。因此不建议用table元素。
二、其实你可以使用 nth-child 来实现你要的效果。
以上。