スタイルウィンドウ属性

定義と使用法

widows この属性は、印刷や印刷プレビューでページの上部に見える必要がある最小行数を設定または返します。

widows この属性はブロックレベルの要素にのみ影響を与えます。

ヒント：widows:5 ページシフターの下に少なくとも5行が見える必要があります。

ヒント：参照してください orphans 属性 ページの下部に表示する必要がある要素の最小行数を設定または返します。

例

widows を変更し、印刷または印刷プレビューを確認してください：

<html>
<head>
<script>
function ChangeWidows() {
  document.getElementById("p1").style.widows = document.getElementById("widows").value;
}
</script>
<style>
.othercontent {
  width: 400px;
  border-top: 19cm solid #c3c3c3;
}
@page {
/* 印刷ページのサイズを設定 */
  size: 21cm 27cm;
  margin-top: 2cm;
}
@media print {
  .widows {
    widows:2;
  }
}
</style>
</head>
<body>
<div class="othercontent">
<input id="widows" value="2">
<button onclick="ChangeWidows();">widows 変更</button>
<p style="font-size:120%" id="p1">
widows を変更し、印刷プレビューを確認してください。<br>
行 2<br>
行 3<br>
行 4<br>
行 5<br>
行 6<br>
行 7<br>
行 8<br>
</p>
<div class="othercontent">
</body>
</html>

自分で試してみてください

文法

widows 属性を返す：

object.style.widows

widows 属性を設定：

object.style.widows = "number|initial|inherit"

属性値

値 説明
number 整数、最小の表示可能行数を指定します。負の値を使用することはできません。デフォルト値は 2 です。
initial この属性をデフォルト値に設定します。参照してください initial。
inherit この属性を親要素から継承します。参照してください inherit。

技術的詳細

デフォルト値： 2
返り値： 文字列、ページの上部に印刷する最小行数を表す。
CSS バージョン： CSS2

ブラウザのサポート

このテーブルの数字には、その属性を完全にサポートする最初のブラウザのバージョンが示されています。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
25.0 8.0 サポートしていません 7.0 10.0