css widows样式

时间:2023-05-09 14:04:47

CSS widows 是一个用于指定在分页时在新页上允许剩余的最少行数。该属性只适用于在分页发生时将内容拆分到新页面的元素,例如文本块和列表。

语法如下:

widows: <number>;

其中 <number> 指定允许的剩余最少行数。默认情况下,该属性值为 2。

下面是一个例子:

<p class="widows-example">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer bibendum
vestibulum neque id suscipit. Nunc rhoncus ipsum vitae dolor ultricies
fermentum. Sed vulputate nisi eu tortor bibendum posuere. Donec elementum
euismod enim vel tempus. Nulla ut fringilla felis. Nullam ac diam at massa
convallis tincidunt a et magna. Vestibulum suscipit lorem ac purus lobortis
hendrerit. Proin accumsan aliquam odio, a cursus turpis mattis eget. Sed id
nisl semper, lobortis velit ac, placerat quam.
</p>
.widows-example {
widows: 4;
}

在这个例子中,.widows-example 元素指定 widows: 4,这意味着至少要在新页面上留下 4 行文本,以避免出现孤立行。

相关词 widows