爱心表白html页面

代码语言:html

所属分类:表白

代码描述:爱心表白html页面,修改姓名向爱的人表白吧

代码标签: 页面

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
<style>
    *{
    margin: 0;
    padding:0;
}
html,body{
    width:100%;
    height:100%;
    /*text-align: center;*/
    background-color: #ffc5b3;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
	background-image: radial-gradient(#ffeded, #ffc7c7);
}
.textCon{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width:700px;
    height:60px;
    margin:50px auto;
}
.text{
    font-size:48px;
}
.heart{
    width:80px;
    height:80px;
    background-color:#cc2a5d;
    margin:200px auto;
    position: relative;
    transform: rotate(45deg);
    animation: heart 1s ease-in infinite;
}
.heart::before,
.heart::after{
    content:'';
    width:100%;
    height:100%;
    background-color:#cc2a5d;
    border-radius: 50%;
}
.heart::before{
    position: absolute;
    top:0;
    left:0;
    transform.........完整代码请登录后点击上方下载按钮下载查看

网友评论0