<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<title>CSS3爱心</title>
<style>
.heart_keleyi_com{
width:160px;
height:200px;
position:relative
}
.heart_keleyi_com:before{
content:" ";
border: 0 solid transparent;
-moz-border-radius:100px;
-webkit-border-radius:100px;
border-radius:100px 100px 0 0;
width:80px;
height:120px;
background:#ff0000;
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
position:absolute;
left:20px;
}
.heart_keleyi_com:after{
content:" ";
border: 0 solid transparent;
-moz-border-radius:100px;
-webkit-border-radius:100px;
border-radius:100px 100px 0 0;
width:80px;
height:120px;
background:#ff0000;
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position:absolute;
left:48px;
top:0px;
}
</style>
</head>
<body>
<div class="heart_keleyi_com"></div>
</body>
</html>
