Commit 14d6a48c by shenjinzhu

添加了使用说明和错误提示

parent 9230722d
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<style type="text/css">
body {
background-image: url("./2.jpg");
}
form {
width: 20%;
margin: 200px auto;
}
.form-group {
margin-top: 20px;
}
#submit:hover {
color: #66afe9;
}
</style>
</head>
<body>
<h5>如需插队,请联系陈栋(674945328)/沈金柱(949131080)</h5>
<form action="/change4weixin/up" enctype="multipart/form-data" method="post">
<span>文件</span>
<input type="file" name="file"/>
<div class="form-group">
<label for="email">邮箱号</label>
<input type="text" name="mail" class="form-control" id="email">
</div>
<div class="form-group">
<label for="emailAgain">重复邮箱号</label>
<input type="text" name="mail2" class="form-control" id="emailAgain">
</div>
<div class="form-group">
<input type="submit" value="提交" class="form-control" id="submit" />
</div>
</form>
</body>
</html>
\ No newline at end of file
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<link rel="stylesheet"
href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script
src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
<style type="text/css">
body {
background-image: url("./2.jpg");
display: flex;
flex-flow: column nowrap;
justify-content: center;
align-items: center;
padding-top: 200px; -
-imgwidth: 0px;
}
form {
margin-top: 3%;
width: 20%;
}
.form-group {
margin-top: 20px;
}
#submit:hover {
color: #66afe9;
}
.example {
position: absolute;
}
.example-title {
display: inline-block;
font-size: 16px;
margin: 20px 5px 10px;
font-weight: bold;
cursor: pointer;
}
.example-title:hover {
color: #66afe9;
}
.ck{
color:red;
}
#imgModal, #fileModal ,#showModal,#errorModal{
padding: 10% calc(50% - 480px);
text-align: center;
}
</style>
</head>
<body>
<h3>如需插队,请联系陈栋(674945328)/沈金柱(949131080)</h3>
<div class="example-div">
<span class="example-title ck" id="show" data-toggle="modal"data-target="#showModal">使用说明</span>
<span class="example-title" id="img" data-toggle="modal" data-target="#imgModal">上传文件要求</span>
<span class="example-title" id="file" data-toggle="modal" data-target="#fileModal">文件内容示范</span>
<span class="example-title" id="error" data-toggle="modal" data-target="#errorModal">出现的错误和原因</span>
</div>
<form action="/change4weixin/up" enctype="multipart/form-data"
method="post">
<span>文件</span> <input type="file" name="file" />
<div class="form-group">
<label for="email">邮箱号</label> <input type="text" name="mail"
class="form-control" id="email">
</div>
<div class="form-group">
<label for="emailAgain">重复邮箱号</label> <input type="text" name="mail2"
class="form-control" id="emailAgain">
</div>
<div class="form-group">
<input type="submit" value="提交" class="form-control" id="submit" />
</div>
</form>
<div class="modal fade example" id="imgModal" tabindex="-1"
role="dialog" aria-labelledby="myModalLabel">
<img src="./upload.jpg" alt="事例">
</div>
<div class="modal fade example" id="fileModal" tabindex="-1"
role="dialog" aria-labelledby="myModalLabel">
<img src="./upload_file.png" alt="事例">
</div>
<div class="modal fade example" id="errorModal" tabindex="-1"
role="dialog" aria-labelledby="myModalLabel">
<img src="./error_file.png" alt="事例">
</div>
<div class="modal fade example" id="showModal" tabindex="-1"
role="dialog" aria-labelledby="myModalLabel">
<img src="./show_file.png" alt="事例">
</div>
<script>
</script>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment