飞碟隐藏首页页眉和页脚

发布于 2024-12-23 22:45:25 字数 982 浏览 1 评论 0原文

我一直在玩飞碟 R8，并尝试隐藏 PDF 首页的页眉和页脚。

我按照提示尝试遵循 W3C 规范内容：element() （W3C 运行元素）在我的 print.css 中。据描述，以下内容应该可以解决我的问题：

@page { @top-center { content: element(header, first-except) }}

但似乎这尚未在 R8 中实现。所以我尝试使用 set-string 方法来实现上面的方法。

#header { set-string: header content() }
@page { @top-center { content: string(header, first-except) }}

但没有任何内容被渲染， content: string() 似乎被破坏了，因为我放入其中的任何内容都不会被渲染：

@page { @top-center { content: "foo" string(header, first-except) }} /*broken*/
@page { @top-center { content: "foo" string(header) }} /*broken*/
@page { @top-center { content: "foo" }} /*works!*/

那么有人知道如何让它工作吗？

原文

I've been playing with the flying saucer R8 and tried to hide header and footer from the front page of my PDF.

I followed that hint tried to follow the W3C specifications for the content: element() (W3C running elements) in my print.css. It is described that the following should solve my problem:

@page { @top-center { content: element(header, first-except) }}

But it seems that this is not yet implemented in R8. So I tried the approach above with the set-string method.

#header { set-string: header content() }
@page { @top-center { content: string(header, first-except) }}

But nothing gets rendered, content: string() seems to be broken, since whatever I put in there will not be rendered:

@page { @top-center { content: "foo" string(header, first-except) }} /*broken*/
@page { @top-center { content: "foo" string(header) }} /*broken*/
@page { @top-center { content: "foo" }} /*works!*/

So has anyone an idea how to get this working?

分享到QQ

分享到微博

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

发布评论

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

以为你会在 2024-12-30 22:45:25

好的，解决方案很简单。我从飞碟手册来源复制了它链接

我必须执行以下操作：

添加第二个不带页码的页脚：

<div id="normalFooter" style="position: running(normalFooter);">
    <div class="footerContent">fancy stuff</div>
    page <span class="page"/> of <span class="pagecount"/> 
</div>
<div id="firstPageFooter" style="position: running(firstPageFooter);">
    <div class="footerContent">fancy stuff</div>
</div>

技巧是 CSS @page :first：

@page {     
    @bottom-right {
        content: element(normalFooter);
    }
} 

@page :first {      
    @bottom-right {
        content: element(firstPageFooter);
    }
}

除第一个带有不同的页脚。

Ok, the soulution was easy. I copied it from the flying saucer manual sources link

I had to do the following:

add a second footer without the page numbering:

<div id="normalFooter" style="position: running(normalFooter);">
    <div class="footerContent">fancy stuff</div>
    page <span class="page"/> of <span class="pagecount"/> 
</div>
<div id="firstPageFooter" style="position: running(firstPageFooter);">
    <div class="footerContent">fancy stuff</div>
</div>

The trick is the CSS @page :first:

@page {     
    @bottom-right {
        content: element(normalFooter);
    }
} 

@page :first {      
    @bottom-right {
        content: element(firstPageFooter);
    }
}

There is a normal footer for all the pages except the first one, that comes with a different footer.

回复收藏 0 原文

流殇 2024-12-30 22:45:25

这似乎对我有用。我最初错过的关键是 #cover 元素上的 string-set 属性。它还展示了如何进行页计数器。 #cover 元素位于我的封面页上，导致第一页上的计数器递增，即使未显示页脚。

        div.header {
            display: block;
            font-size: 8pt;
            position: running(header);
        }

        div.header .project-date {
            padding-left: 8px;
        }

        div.header .project-name {
            padding-left: 4px;
        }

        div.footer {
            font-size: 8pt;
            display: block;
            position: running(footer);
        }

        div.footer .page-number:before {
            counter-increment: section;
            content: counter(section);
        }


        @page {
            size: 8.5in 11in;
            margin: 1cm;
            @top-center { content: element(header, last-except)}

            @bottom-center { content: element(footer, last-except)}

        }

        #cover {
            string-set: footer header;
            counter-increment: section;
        }

This seems to work for me. The key thing I missed initially was the string-set property on the #cover element. It also shows how to do the page counter. The #cover element is on my cover page resulting in the counter incrementing on page one even though the footer is not being shown.

        div.header {
            display: block;
            font-size: 8pt;
            position: running(header);
        }

        div.header .project-date {
            padding-left: 8px;
        }

        div.header .project-name {
            padding-left: 4px;
        }

        div.footer {
            font-size: 8pt;
            display: block;
            position: running(footer);
        }

        div.footer .page-number:before {
            counter-increment: section;
            content: counter(section);
        }


        @page {
            size: 8.5in 11in;
            margin: 1cm;
            @top-center { content: element(header, last-except)}

            @bottom-center { content: element(footer, last-except)}

        }

        #cover {
            string-set: footer header;
            counter-increment: section;
        }

回复收藏 0 原文

~没有更多了~