css字上有斜线 |css的 display属性的值

h1 {
font-size: 48px;
position: relative;
}
h1::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 20px;
border-bottom: 2px solid black;
border-left: 2px solid black;
transform: translate(-15px, -10px) rotate(-45deg);
}

在上面的代码中，首先设置了标题（h1）的字体大小和位置为相对定位。接着，使用伪元素“::before”在标题前面插入一个空白元素，设置其为绝对定位，以便与标题重叠。

然后，大家设置该元素的宽度和高度，以便使其覆盖标题中的一部分，并使用“border-bottom”和“border-left”属性设置线条的样式和颜色。最后，使用“transform”属性将该元素旋转并移动到标题的左上角，以形成斜线效果。

总的来说，使用CSS实现字体上的斜线效果非常简单，只需要一些基本的样式设置和精细的位置调整即可。尝试添加斜线效果来突出您网页中最重要的文字或标签，以更好地吸引注意力。