开发者

How to declare a div in @page @top-left

开发者 https://www.devze.com 2022-12-28 19:48 出处:网络
How do I declare that a DIV should be displayed in top-left corner of every page and not in its relative position.

How do I declare that a DIV should be displayed in top-left corner of every page and not in its relative position.

I have a div like:

<div id=header>Document&l开发者_StackOverflow中文版t;/div>

and I would like to display it on every page in top left corner using css like:

@page {
    size: 8.5in 11in;
    margin: 0.25in;
    border: thin solid black;
    padding: 1em;


     @top-left {
        content: ???? ;
      }
}

Thank you.


I realise that this question is a bit old, but for anyone like me who comes here searching for a way to do this, it is possible using CSS3 running elements: http://www.w3.org/TR/2007/WD-css3-gcpm-20070504/#running1

In this example, the header is hidden from view in all media types except print. On printed pages, the header is displayed top center on all pages, except where h1 elements appear.

<style>
  div.header { display: none }
  @media print {
  div.header {
    display: block;
    position: running(header);
  }
  @page { @top-center { content: element(header, last-except) }}
</style>
...
<div class="header">Introduction</div>

<h1 class="chapter">An introduction</div>


Doesn't

#header {
   position: fixed;
   top: 0;
   left: 0;
}

work? See Printing Headers. Also, have a look at the W3C specification of position: fixed.

EDIT: if I read the CSS 3 specs concerning Margin Boxes well enough, together with the CSS 2.1 specs about the content property, I don't think you can embed a <div> from your page into the contents of a Margin Box, alas.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号