HTML - DOM樣式物件widows屬性

HTML DOM樣式物件**widows**屬性設定或返回元素在頁面頂部可見的最小行數。它隻影響塊級元素。

語法

設定widows屬性

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

獲取widows屬性

object.style.widows;

屬性值

值	描述
數字	指定可見的最小行數。其預設值為2，並且不接受負值。
initial	用於將此屬性設定為其預設值。
inherit	用於繼承其父元素的屬性。

返回值

它返回一個字串值，表示在頁面頂部列印的最小行數。

HTML DOM樣式物件“widows”屬性示例

以下示例設定頁面頂部可見的最小行數，最初設定為2。單擊**設定Widows**按鈕之前和之後請檢視**列印預覽**。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM Style Object widows Property
    </title>
    <style>
        .container {
            width: 500px;
            border-top: 19cm solid #04af2f;
        }
        @page {
            size: 21cm 27cm;
            margin-top: 2cm;
        }
        @media print {
            .widows {
                widows: 2;
            }
        }
        p {
            font-size: 120%;
        }
    </style>
</head>
<body>
    <div class="container">
        <input id="widows" value="2" />
        <button onclick="fun();">Set Windows</button>
        <p id="win">
            Change widows and see the print preview.<br>
            Line 2<br>
            Line 3<br>
            Line 4<br>
            Line 5<br>
            Line 6<br>
            Line 7<br>
            Line 8<br>
        </p>
        <div class="container"></div>
        <script>
            function fun() {
                let x = document.getElementById("widows").value;
                document.getElementById("win").style.widows = x;
            }
        </script>
</body>
</html>

支援的瀏覽器

屬性
widows	是 25	是 12	否	是 1.3	是 9.2

html_dom_style_object_reference.htm

列印頁面