css3 长方形对角线 |css 字体非粗体

.box {
width: 200px;
height: 200px;
border: 2px solid black;
transform: rotate(45deg);
}

上述代码是创建一个长方形对角线的示例。首先，大家定义一个具有200像素宽和高的盒子，并设置黑色边框。然后使用CSS3转换rotate函数，将该盒子旋转45度。这样，在旋转后，原来的矩形的两个角会成为该矩形的对角线。您可以通过更改旋转度数来获得不同的角度。

如果您想要更改对角线的颜色或样式，可以使用CSS3的其他属性，例如border-top，border-right和border-bottom等。以下是一个例子。

.box {
width: 200px; 
height: 200px; 
border-bottom: 2px solid black;
border-right: 2px solid black;
transform: rotate(45deg);
}

在这种情况下，大家保留了black色的2像素宽度边框，并删除了其他三个侧面的边框。然后，大家通过对border-bottom和border-right属性设置相同的颜色和粗细来创建对角线效果。

长方形对角线是CSS3的一个很好的特性，它可以帮助大家在网页设计中获得独特的效果。与其他CSS3属性一起使用，可以创建出一些优美的视觉效果，使您的网站脱颖而出。