html代码表白爱心

今天是情人节，我想用HTML代码表白我的心意。

!DOCTYPE html>
    html>
    head>
    	title>
    表白爱心/title>
    	style>
body {
    	background-color: #f2f2f2;
}
.heart {
    	width: 100px;
    	height: 100px;
    	margin: 50px auto;
    	position: relative;
    	transform: rotate(45deg);
    	background-color: #ff5555;
    	transition: all .2s ease-in-out;
    	box-shadow: 5px 5px 5px rgba(0,0,0,.3);
}
.heart:hover {
    	transform: scale(1.2);
    	background-color: #ff2a2a;
    	box-shadow: 10px 10px 10px rgba(0,0,0,.3);
}
.heart:before,.heart:after {
    	content: "";
    	position: absolute;
    	background-color: #ff5555;
}
.heart:before {
    	width: 100px;
    	height: 100px;
    	top: -50px;
    	left: 0px;
    	border-radius: 50px 50px 0 0;
}
.heart:after {
    	width: 100px;
    	height: 100px;
    	top: 0px;
    	left: 50px;
    	border-radius: 0 50px 50px 0;
}
    	/style>
    /head>
    body>
    	div class="heart">
    /div>
    /body>
    /html>
    

这是一个表白爱心，它会随鼠标悬停而放大变色，是不是很可爱呢？

我用HTML代码创造了这个小小的表白礼物，希望你能喜欢，并且接受我的爱。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！