6

CSS 3 でヘッダーとフッターを配置する正しい方法は何ですか? http://www.w3.org/TR/css3-gcpm/を読んでいますが、以下が実行中の要素の使用方法の正しい解釈であるかどうかを知りたいです。

実行中の要素には、ドキュメントの通常の「フロー」からシフトされるというプロパティがあり、ヘッダーとフッターにはそれが必要です。

それは私が達成しようとしている重要な部分であり、それ以外の場合は、セクションに名前を付けてページの余白内で使用できる文字列セット属性があります。サードパーティの実装がそれらをサポートしているかどうかも知りたいですか? いくつかのツールで同様のマークアップがあることは知っていますが、これが 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>

http://jsfiddle.net/VubtS/ - ただし、ページ付きメディア用であるため、もちろんブラウザでは表示されません。

CSS 3 にどれだけ準拠しているかを確認するために、いくつかの HTML-PDF 変換プログラムでこれを試していますが、明らかにこれをレンダリングするものはありません。私のマークアップは Css3 定義に従って正しいですか?

4

3 に答える 3

6

あなたの構文は正しいと思います。ただし、ブラウザのサポートもまだ見ていません。私が調べた商用の HTML から PDF への変換ツール (Winnovation、DynamicPDF、EvoPDF、RasterEdge、wkhtmltopdf など) のほとんどは、WebKit または CSS3 Paged Media をサポートしない別のレイアウト エンジンを使用しています。

これらはそうだと思いますが...

于 2014-02-01T04:14:36.927 に答える