css怎么画心形 |css圆边框

下面是CSS代码：

.heart {
position: relative;
width: 100px;
height: 90px;
}
.heart:before,
.heart:after {
position: absolute;
content: "";
left: 50px;
top: 0;
width: 50px;
height: 80px;
background: #fc2f70;
transform: rotate(-45deg);
transform-origin: 0 100%;
border-radius: 0 0 50% 50%;
}
.heart:after {
left: 0;
transform: rotate(45deg);
transform-origin: 100% 100%;
border-radius: 0 0 50% 50%;
}

上面的代码中，大家使用了伪元素before和after来实现两个半心的样式，并利用transform属性进行旋转，最后使用border-radius属性设置填充半圆形的效果。最终，大家将两个半心叠在一起，就实现了一个完整的心形。

在HTML中，大家可以这样使用：

<div class="heart"></div>

这里大家使用了一个div元素，并给它添加了一个class为“heart”的样式。通过CSS，大家就可以在页面上看到一个可爱的心形了。