樣式 widows 屬性
示例
更改 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 屬性設定或返回元素在頁面頂部(用於列印或列印預覽)必須可見的最小行數。
widows 屬性僅影響塊級元素。
提示: widows:5 表示在分頁符下方至少必須可見 5 行。
提示: 請參閱 orphans 屬性以設定或返回元素在頁面底部必須可見的最小行數。
瀏覽器支援
屬性 | |||||
---|---|---|---|---|---|
widows | 25.0 | 8.0 | 不支援 | 7.0 | 10.0 |
語法
返回 widows 屬性
物件.style.widows
設定 widows 屬性
物件.style.widows = "數字|initial|inherit"
屬性值
值 | 描述 |
---|---|
數字 | 一個整數,指定最小可見行數。不允許負值。預設值為 2 |
initial | 將此屬性設定為其預設值。閱讀關於 initial |
inherit | 從其父元素繼承此屬性。閱讀關於 inherit |
技術詳情
預設值 | 2 |
---|---|
返回值 | 一個字串,表示在頁面頂部列印的最小行數 |
CSS 版本 | CSS2 |