左对齐的 HTML 表格格式

标签 html css html-table

我正在尝试用 HTML 格式化表格,但我似乎无法让它工作。我希望所有内容都左对齐并且字体大小为 125%。标题应该是蓝色的,而其他一切都应该是黑色的。

截至目前,表格将全部为黑色文本,但大小合适。标题没有左对齐,而是在两者之间看似随机的制表符。我对 th 做了一些更改,由于某种原因会影响整个表。不过,我似乎无法复制它(忘了我是怎么做到的)。

这是我的代码:

<!DOCTYPE html PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN'>
<html>

<head>
<style type='text/css'> 
p {margin: 0em 0 0em 0;}
th {color: blue; text-align: left;}
tr {color: black;text-align: left;}
table {font-size:125%;}
</style>
<meta content='text/html; charset=ISO-8859-1'http-equiv='content-type'> 
<title>Test Results</title> 
</head> 

<body>
<table>
<th>
  <td>Test</td>
  <td>Status</td>
  <td>DateTime</td>
  <td>Blank Lines</td> 
</th>
<tr>
  <td>TestNameHere</td>
  <td>PASSEd</td>
  <td>20140730 15:13:13</td>
  <td>1,3,5,2,7,9</td>
</tr>
</table> 
</body>
</html>

我对此还是很陌生,但格式似乎与我在网上看到的一切相符。我试着把颜色变成十六进制,但它没有改变任何东西。

最佳答案

这有效 fiddle

HTML

<table>
<tr>
  <th>Test</th>
  <th>Status</th>
  <th>DateTime</th>
  <th>Blank Lines</th> 
</tr>
<tr>
  <td>TestNameHere</td>
  <td>PASSEd</td>
  <td>20140730 15:13:13</td>
  <td>1,3,5,2,7,9</td>
</tr>
</table> 

CSS

p {margin: 0em 0 0em 0;}
th {color: blue; text-align: left;}
tr {color: black;text-align: left;}
table {font-size:125%;}

你的问题是你使用了<th>而不是 <tr>以及你应该在哪里提供 <th>对于标题,你给了<td>

关于左对齐的 HTML 表格格式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24614064/

相关文章:

html - 对齐可滚动表中的 HTML 列

html - 带有悬停动画的 Bootstrap 按钮

c# - 如何从外部脚本调用 HTML 中的 JavaScript 函数

html - 如何在下面的形状周围添加框阴影

html - 如何在没有 "phantom"行的情况下创建包含两列内容的列表项?

CSS - 选择特定元素之外的所有元素

asp.net - 来自 css 文件的 .htc 引用

javascript - 实时 JavaScript 计算

html - 滚动表格时如何使 <table> 的第一列不可移动?

html - 带有 child 的 CSS Div 表现得像表格,让一个 child 填充宽度