用htmlcssjs 写一个和女生表白的
<p>页面</p>
<!DOCTYPE html>
<html>
<head>
<title>表白</title>
<style>
body{
background-color: #FFE4E1;
font-family: Arial, sans-serif;
}
<pre><code> h1{
text-align: center;
font-size: 40px;
margin-top: 50px;
color: #FF69B4;
}
.container{
width: 80%;
margin: auto;
padding: 20px;
background-color: #FFF;
box-shadow: 0px 0px 10px #888;
border-radius: 10px;
margin-top: 50px;
text-align: center;
}
.btn{
background-color: #FF69B4;
color: #FFF;
padding: 10px 20px;
border: none;
border-radius: 5px;
font-size: 20px;
cursor: pointer;
margin-top: 20px;
}
.btn:hover{
background-color: #FF1493;
}
.love{
font-size: 80px;
color: #FF69B4;
}
.message{
font-size: 30px;
color: #FF69B4;
margin-top: 50px;
}
.input{
padding: 10px;
border: none;
border-radius: 5px;
margin-top: 20px;
width: 50%;
font-size: 20px;
box-shadow: 0px 0px 5px #888;
margin-bottom: 20px;
transition: box-shadow .3s ease-in-out;
}
.input:focus{
box-shadow: 0px 0px 10px #FF69B4;
outline: none;
}
</style>
</code></pre>
</head>
<body>
<h1>向你表白</h1>
<div class="container">
<div class="love">
❤
</div>
<div class="message">
我想对你说：
</div>
<input type="text" class="input" placeholder="请输入你想说的话">
<button class="btn">发送</button>
</div>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/8fa 著作权归作者所有。请勿转载和采集!