我有一个包含大量行的HTML表,我需要右对齐一列.
我知道以下方法,
<tr><td>..</td><td>..</td><td align='right'>10.00</td><tr>
Run Code Online (Sandbox Code Playgroud)
和
<tr><td>..</td><td>..</td><td class='right-align-class'>10.00</td><tr>
Run Code Online (Sandbox Code Playgroud)
在这两种方法中,我必须在每个<tr>标记上重复align或class参数.(如果有1000行,我必须将align ='right'或class ='right-align- class'1000次.)
有没有有效的方法来做到这一点?有没有直接的说法,将所有行中的第三列对齐?
W3指定表列(包含<col>元素)只允许四个CSS规则- 边框,背景,宽度和可见性.
有谁知道这个决定背后的原因?如果你可以有边框和背景,为什么不能使用字体和颜色?
这个XHTML 1.1有什么问题:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html><body><table>
<colgroup>
<col style="width: 10em; text-align: right;" />
<col style="width: 10em;" />
</colgroup>
<tbody>
<tr>
<td>test1</td>
<td>test2</td>
</tr>
</tbody>
</table></body></html>
Run Code Online (Sandbox Code Playgroud)
问题在于它test1不是正确的,正如它应该的那样.
我试图在html代码中隐藏一些col.使用MDN colgroup和col添加,我正在玩cols的样式.
在<td>与内容文本"可见的"在所有的浏览器(好)可见,在与内容文本"隐藏"在铬(坏)可见和隐藏在Firefox和边缘.(好).
我可以重新创建问题的最短代码在这里:
<!doctype html>
<html>
<head>
<title>css example</title>
<style type='text/css'>
col.visible {}
col.hidden { visibility:collapse; }
</style>
</head>
<body>
<table border='1'>
<colgroup>
<col class='visible'>
<col class='hidden'>
<tbody>
<tr>
<td>visible</td>
<td>hidden</td>
</tr>
</tbody>
</colgroup>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud) 我读到表的每一列都可以使用<colgroup>和设置样式<col>.我尝试了下面这个,但风格的表现似乎不起作用.我该如何解决?当我用width财产这样做时,它有效.text-align财产有什么问题吗?
<html><body><table>
<colgroup>
<col style="text-align:right" />
<col style="text-align:center" />
<col style="text-align:left" />
</colgroup>
<tr>
<td>aaaaaaaaaaa</td>
<td>bbbbbbbbbbb</td>
<td>ccccccccccc</td>
</tr>
<tr>
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
</tr>
</table></body></html>
Run Code Online (Sandbox Code Playgroud)
结果是默认情况下每个列都保持对齐,忽略了中的规范colgroup.

我使用的是Chrome 17.
我正在尝试使用 css 创建一个 html 表。第一列是等宽字体,因为它包含计算机代码。
但是, font-family 属性似乎不起作用。这是 html 文件:
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<table cellspacing="0" class="software">
<COLGROUP class="command">
<COLGROUP>
<tr>
<td>command 1</td>
<td>description</td>
</tr>
<tr>
<td>command 2</td>
<td>description</td>
</tr>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
对应的css文件包含以下内容:
table.software{
font-family: Arial;
font-size: 13pt;
border-width: 1px 1px 1px 1px;
border-style: solid;
}
table.software td{
text-align: left;
border-width: 1px 1px 1px 1px;
border-style: solid;
padding: 5px;
}
.command{
font-family: monospace;
font-size: 10pt;
width: 300;
}
Run Code Online (Sandbox Code Playgroud)
我将非常感谢如何实现字体更改的指针。谢谢!
问候,迈克尔