Register
> 博客>

html问卷调查 源代码

新速特源码 1年前 40 0

<!DOCTYPE html>
<html>
<head>
<title>问卷调查</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
}
h1 {
text-align: center;
margin-top: 50px;
}
form {
background-color: #fff;
padding: 20px;
margin: 0 auto;
max-width: 600px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
label {
display: block;
margin-bottom: 10px;
font-weight: bold;
}
input[type="text"], input[type="email"], select {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
margin-bottom: 20px;
font-size: 16px;
}
select {
height: 40px;
}
input[type="submit"] {
background-color: #4CAF50;
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
}
input[type="submit"]:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<h1>问卷调查</h1>
<form action="#" method="post">
<label for="name">姓名：</label>
<input type="text" id="name" name="name" required>

    <label for="email">邮箱：</label>
    <input type="email" id="email" name="email" required>

    <label for="age">年龄：</label>
    <select id="age" name="age" required>
        <option value="">请选择</option>
        <option value="18以下">18以下</option>
        <option value="18-25">18-25</option>
        <option value="26-35">26-35</option>
        <option value="36-45">36-45</option>
        <option value="46-55">46-55</option>
        <option value="56以上">56以上</option>
    </select>

    <label for="gender">性别：</label>
    <input type="radio" id="male" name="gender" value="男" required>
    <label for="male">男</label>
    <input type="radio" id="female" name="gender" value="女" required>
    <label for="female">女</label>

    <label for="feedback">您对我们的服务是否满意？</label>
    <input type="radio" id="satisfied" name="feedback" value="满意" required>
    <label for="satisfied">满意</label>
    <input type="radio" id="not-satisfied" name="feedback" value="不满意" required>
    <label for="not-satisfied">不满意</label>

    <label for="comments">您有什么建议或意见？</label>
    <textarea id="comments" name="comments" rows="5"></textarea>

    <input type="submit" value="提交">
</form>

</body>
</html>

这是一个简单的HTML问卷调查的源代码，包括姓名、邮箱、年龄、性别、对服务的满意度和意见建议等问题。其中，姓名、邮箱、年龄和性别是必填项，满意度和意见建议是选填项。用户填写完问卷后，可以点击提交按钮将问卷提交到服务器进行处理。

该问卷调查的样式使用了CSS进行美化，包括背景颜色、字体、输入框样式等。同时，也使用了一些HTML5的新特性，如输入框类型为email、select下拉框等。

需要注意的是，该问卷调查的action属性值为“#”，表示提交到当前页面，需要使用后端技术进行处理。如果需要将问卷提交到服务器进行处理，需要将action属性值修改为服务器端处理程序的URL。

腾讯云最新优惠活动，点击查看

Related

热门文章

微海报