Question

我每天都在学习更多关于CSS的知识，并继续对可能的事情感到惊讶。例如，我刚刚了解了第一个子伪元素 - 不知道你能做到这一点！所以，因为我继续感到惊讶，我想我会问这里是否有办法完成我所追求的目标，即使我无法找到解决方案。

我想更改非首页上显示的表格中元素的内容。换句话说，当一个表分解到一个新页面并再次呈现时，我想将内容（“Cont ...”）附加到标题单元格。

我发出了一个非常简单的例子，当你在浏览器中打印预览时会生成两个页面，每个页面有两行。在SECOND页面上，我想使用CSS来改变元素的内容。

有人有什么想法吗？我必须用CSS做这个，我不能改变主要的html，我只能改变样式。

<html>
<head>
</head>
<body>
    <table border="1">
        <thead>
            <tr>
                <th>
                    Column 1
                </th>
                <th>
                    Column 2
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Row 1, Column 1</td>
                <td>Row 1, Column 2</td>
            </tr>
            <tr style="page-break-after:always;">
                <td>Row 2, Column 1</td>
                <td>Row 2, Column 2</td>
            </tr>
            <tr>
                <td>Row 3, Column 1</td>
                <td>Row 3, Column 2</td>
            </tr>
            <tr>
                <td>Row 4, Column 1</td>
                <td>Row 4, Column 2</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

Answer 1

您可以使用：nth-child伪元素。

http://css-tricks.com/5452-how-nth-child-works/

您只能使用以下命令定位特定行：nth-child（）或：nth-of-type（）。我不确定：nth-child可以处理一个范围，所以你可能不得不链接你css而不是恼人地喜欢：

:nth-child(3), :nth-child(4), :nth-child(eleventy!!1!) {properties}

更多： http://www.quirksmode.org/css/nthchild.html

现在，当然 - 如果你使用Sass或Compass - 这种链接很简单。检查两个项目。

Answer 2

由于content不是listed作为在页面上下文中应用的属性，因此我认为您无法实现它。但请记住，这是一项正在进行的工作：他们可能会将其添加到您的输入中。

尽管有一天，你仍然可以这样做：

@media print {
 @page :nth(n+2) {
  @top-center {
   content: "something";
  }
 }
}

use：content伪元素来改变非第一元素内容

2 个答案: