在标题和正文的前几句中断时,可以使用CSS的::first-line
伪元素来控制样式,以避免中断的情况。下面是一个示例代码:
HTML:
Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed imperdiet neque a massa consectetur, vitae posuere nulla iaculis.
Proin pharetra mauris non turpis consequat, nec lobortis mi ultrices. Nullam eleifend enim non ultrices eleifend.
CSS:
.container h1::first-line {
font-weight: bold;
font-size: 24px;
}
.container p::first-line {
font-weight: bold;
}
在上述示例中,::first-line
伪元素被应用于h1
和p
元素的第一行。这样可以确保标题和正文的前几句不会被样式中断,而是保持一致的样式。你可以根据需要自定义::first-line
伪元素的样式,以满足你的设计需求。