css3画弯曲的线条 |css3鼠标悬浮样式

/*画弯曲的线段*/
#curved-line {
width: 200px;
height: 200px;
position: relative;
}
#curved-line:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 200px;
border-radius: 50% 0 0 0;
transform-origin: 100% 100%;
transform: rotate(-45deg);
border: 2px solid #000;
box-sizing: border-box;
}
/*画曲线*/
#curved-line:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 100px;
border-radius: 0 0 50% 0;
transform-origin: 100% 100%;
transform: rotate(-45deg);
border: 2px solid #000;
box-sizing: border-box;
}

上面的代码可以画出一个弯曲的带有弧形的线段，使用了border-radius、transform、transform-origin等属性，让设计更加曲线优美，更加具有视觉冲击力。

总之，在CSS3中，大家可以使用各种各样的属性和技巧来让大家的设计更加有趣、更加富有创意性。当大家需要画弯曲的线条时，可以使用以上的代码作为参考，结合自己的需求进行调整，创造出更美丽的设计效果。