制作一个表单页面:HTML 表单创建教程
<!DOCTYPE html>
<html>
<head>
<title>制作一个表单页面:HTML 表单创建教程</title>
<style>
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
color: #444;
}
form {
background-color: #fff;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
width: 500px;
margin: 0 auto;
}
h2 {
text-align: center;
margin-top: 0;
margin-bottom: 20px;
}
label {
display: block;
margin-bottom: 10px;
font-size: 18px;
}
input[type='text'], input[type='email'], textarea {
padding: 10px;
border: 1px solid #ddd;
border-radius: 3px;
width: 100%;
font-size: 16px;
margin-bottom: 20px;
}
input[type='submit'] {
background-color: #4CAF50;
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 3px;
font-size: 18px;
cursor: pointer;
}
input[type='submit']:hover {
background-color: #3e8e41;
}
</style>
</head>
<body>
<form>
<h2>表单页面</h2>
<label for='name'>姓名:</label>
<input type='text' id='name' name='name' required>
<pre><code> <label for='email'>邮箱:</label>
<input type='email' id='email' name='email' required>
<label for='message'>留言:</label>
<textarea id='message' name='message' rows='5' required></textarea>
<input type='submit' value='提交'>
</form>
</code></pre>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/muZn 著作权归作者所有。请勿转载和采集!