写一个网页背景天蓝色做一个个人信息登记表标题白色加粗居中表格白色填写框天蓝色姓名不超过5个文字性别是单选按钮不换行爱好是多选框5个选项不换行邮箱个人简介默认是123456能上传文件上传按钮是红色显示文字是上传文件提交按钮是黑色提交之后跳转到百度首页使用css做一些样式
<!DOCTYPE html>
<html>
<head>
<title>个人信息登记表</title>
<style>
body {
background-color: skyblue;
}
h1 {
text-align: center;
font-size: 32px;
font-weight: bold;
color: white;
}
table {
margin: 0 auto;
background-color: white;
border-collapse: collapse;
}
td {
padding: 10px;
text-align: center;
}
input[type="text"],
input[type="email"] {
width: 100%;
padding: 10px;
border: none;
background-color: skyblue;
color: white;
font-size: 16px;
}
input[type="radio"],
input[type="checkbox"] {
margin: 0 10px;
vertical-align: middle;
}
.submit-btn {
display: block;
margin: 20px auto;
padding: 10px 20px;
background-color: black;
color: white;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
.upload-btn {
display: block;
margin: 0 auto;
padding: 10px 20px;
background-color: red;
color: white;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
</style>
</head>
<body>
<h1>个人信息登记表</h1>
<form action="https://www.baidu.com">
<table>
<tr>
<td>姓名：</td>
<td><input type="text" name="name" maxlength="5"></td>
</tr>
<tr>
<td>性别：</td>
<td>
<input type="radio" name="gender" value="male">男
<input type="radio" name="gender" value="female">女
</td>
</tr>
<tr>
<td>爱好：</td>
<td>
<input type="checkbox" name="hobby" value="reading">阅读
<input type="checkbox" name="hobby" value="music">音乐
<input type="checkbox" name="hobby" value="sports">运动
<input type="checkbox" name="hobby" value="travel">旅游
<input type="checkbox" name="hobby" value="photography">摄影
</td>
</tr>
<tr>
<td>邮箱：</td>
<td><input type="email" name="email"></td>
</tr>
<tr>
<td>个人简介：</td>
<td><textarea name="intro" rows="5" cols="30" placeholder="123456"></textarea></td>
</tr>
<tr>
<td>上传文件：</td>
<td>
<input type="file" name="file">
<label for="file" class="upload-btn">上传文件</label>
</td>
</tr>
</table>
<button type="submit" class="submit-btn">提交</button>
</form>
</body>
</html>
原文地址: http://www.cveoy.top/t/topic/bmgG 著作权归作者所有。请勿转载和采集!