当前位置：文江博客话题详情

CSS HTML css-tables

使用 CSS，如何设置单个单元格或单个列的格式？

发布于 2024-08-02 11:23:18 字数 31 浏览 3 评论 0原文

使用 CSS，如何设置单个单元格或单个列的格式？

收藏 0

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

评论（7）

乖乖兔^ω^ 2024-08-09 11:23:18

使用 ID 选择器仅定位页面的一个元素，在本例中为表格单元格：

 <tr>
  <td id="foo"></td>
 </tr>

然后在 CSS 中：

#foo
{
 //-- CSS styling goes here just for this element only
}

井号 (#) 标记该名称选择器属于id。您可以进一步在样式表中将其锁定，以仅应用于具有该 ID 的 TD 单元格，如下所示：

td#foo
{
 //-- CSS styling goes here just for this element only
}

如果将 rowspan 属性添加到 TD 中，您将能够将其变成一个专栏并保留您可能已经设定的样式。

<td id="foo" rowspan="3"></td>

如果您用前面的句点 (.) 标记 CSS 选择器名称，如下所示：

.foo
{
  //-- CSS styles
}

它将针对 HTML 中的 class 选择器，并且如果您将 CSS class 属性应用于标签，如下所示：

 <tr>
  <td class="foo"></td>
  <td class="foo"></td>
  <td class="foo"></td>
 </tr>

不要使用CLASS，除非它会在页面上出现多次。

Use the ID selector to target just that one element of the page, in this case, a table cell:

 <tr>
  <td id="foo"></td>
 </tr>

Then in the CSS:

#foo
{
 //-- CSS styling goes here just for this element only
}

That hash symbol (#) marks that name selector as belonging to an id. You can further lock it down in the stylesheet to apply only to a TD cell with that ID like so:

td#foo
{
 //-- CSS styling goes here just for this element only
}

If you add in the rowspan attribute into the TD, you'll be able to turn that into a column and keep the styling you may have set out.

<td id="foo" rowspan="3"></td>

If you mark the CSS selector name with a preceding period (.), like this:

.foo
{
  //-- CSS styles
}

that will target class selectors in the HTML and you can style more than one matching element if you apply the CSS class attribute to the tag, like so:

 <tr>
  <td class="foo"></td>
  <td class="foo"></td>
  <td class="foo"></td>
 </tr>

Don't use CLASS unless it will appear more than once on the page.

回复收藏 0 原文

情感失落者 2024-08-09 11:23:18

为单元格指定一个类名称并设置该类的样式。

<td class="cellClass">test</td>

.cellClass { color: #a9a9a9 }

Give the cell a class name and style the class.

<td class="cellClass">test</td>

.cellClass { color: #a9a9a9 }

回复收藏 0 原文

帥小哥 2024-08-09 11:23:18

对于表格单元格，您需要为其提供某种标识符，以便您可以引用它。根据您的需要，这将是一个类或一个 id。

<td class="specialCell">...</td>

然后，您可以在 CSS 中应用不同的格式：

.specialCell { color: red; }

如果您想对列应用不同的样式，可以使用标签，但浏览器支持有限。您可能最好手动将该类应用于所有元素（或使用 Javascript）

For table cells, you'll need to give it some sort of identifier such that you can refer to it. Depending on your needs, this will be either a class or an id.

<td class="specialCell">...</td>

In your CSS you can then apply different formatting:

.specialCell { color: red; }

If you want to apply different styles to a column, there is the <col> tag, but browser support is limited. You're probably better to apply that class to all elements manually (or by using Javascript)

回复收藏 0 原文

悸初 2024-08-09 11:23:18

您可以设置适用的 COLGROUP 样式：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <style type="text/css">
            #special { background:yellow }
        </style>
    </head>
    <body>
        <table>
            <colgroup></colgroup>
            <colgroup id="special"></colgroup>
            <tr>
                <td>a</td>
                <td>1</td>
            </tr>
            <tr>
                <td>b</td>
                <td>2</td>
            </tr>
        </table>
    </body>
</html>

You can style the COLGROUP that applies:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <style type="text/css">
            #special { background:yellow }
        </style>
    </head>
    <body>
        <table>
            <colgroup></colgroup>
            <colgroup id="special"></colgroup>
            <tr>
                <td>a</td>
                <td>1</td>
            </tr>
            <tr>
                <td>b</td>
                <td>2</td>
            </tr>
        </table>
    </body>
</html>

回复收藏 0 原文

貪欢 2024-08-09 11:23:18

查看 HTML 和标签，允许您将格式应用于一次整列或相邻的列组。

回复收藏 0 原文

爱人如己 2024-08-09 11:23:18

为单元格/列指定一个类或 id，并使用 css 将格式应用于该单元格/列

回复收藏 0 原文

时光瘦了 2024-08-09 11:23:18

您可以为一列指定两个名称。 ex

<div class="foo"></div>
<div class="foo bar"></div>
<div class="foo"></div>

div.foo { color: #fff; }
div.bar { background-color: green; }

也许这可以解决你的问题？

you can assign two names to a column. ex

<div class="foo"></div>
<div class="foo bar"></div>
<div class="foo"></div>

div.foo { color: #fff; }
div.bar { background-color: green; }

perhaps that could solve your problem?

回复收藏 0 原文

~没有更多了~

关于作者

暂无简介

0 文章

0 评论

20 人气

关注发私信

相关话题

热门标签

操作系统程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端

推荐作者

lioqio

文章 0 评论 0

Single

文章 0 评论 0

禾厶谷欠

文章 0 评论 0

alipaysp_2zg8elfGgC

文章 0 评论 0

qq_N6d4X7

文章 0 评论 0

放低过去

文章 0 评论 0

友情链接

我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的隐私政策了解更多相关信息。单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。

原文