在 CSS 3 中放置运行元素的标准方法

Nis*_*ant 5 html css media css-gcpm

在 CSS 3 中放置页眉和页脚的正确方法是什么?我正在阅读http://www.w3.org/TR/css3-gcpm/,我想知道以下内容是否正确解释了如何使用运行元素。

运行元素具有从文档的正常“流”转移的属性,页眉和页脚需要它。

这是我试图实现的重要部分,否则有一个 string-set 属性可用于命名一个部分并在页边距的其他地方使用它。我也很好奇 3rd 方实现是否支持它们?我知道一些工具中有一些类似的标记,但我想知道这是否是 CSS 的意思?

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Testing</title>
<style type="text/css">
div.header {position: running(header)}
div.footer {position: running(footer)} 
@page{
         @top-center {content: element(header)}
         @bottom-center {content: element(footer)}
     }    
</style>
</head>

<body>

<div class="header"> HEADER </div> 
<div class="footer"> FOOTER </div>
<div>
    Normal Text
</div>
</body>
<html>
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/VubtS/ - 但当然浏览器不会显示它,因为它用于分页媒体。

我正在一些 HTML-PDF 转换中尝试此操作,以查看它们符合 CSS 3 的程度,但显然它们都没有呈现此。根据 Css3 定义,我的标记是否正确?

小智 6

我相信你的语法是正确的。但是,我还没有看到浏览器对它的支持。我看过的大多数商业 HTML 转 PDF 工具(Winnovation、DynamicPDF、EvoPDF、RasterEdge、wkhtmltopdf 等)都使用 WebKit 或其他不支持 CSS3 分页媒体的布局引擎。

我认为这些虽然...