jquery带进度条答题表单效果代码
代码语言:html
所属分类:表单美化
代码描述:jquery带进度条答题表单效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
/*custom font*/
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/opensans/v18/mem8YaGs126MiZpBA-UFVZ0e.ttf) format('truetype');
}
/*basic reset*/
* {
margin: 0;
padding: 0;
}
html {
height: 100%;
background: #0e0e0e;
}
body {
font-family: "Open Sans", arial, verdana;
}
/*form styles*/
#msform {
width: 600px;
margin: 50px auto;
text-align: center;
position: relative;
}
#msform fieldset {
background: white;
border: 0 none;
border-radius: 3px;
box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
padding: 20px 30px;
box-sizing: border-box;
width: 80%;
margin: 0 10%;
/*stacking fieldsets above each other*/
position: absolute;
}
/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type) {
display: none;
}
/*inputs*/
#msform input,
#msform textarea {
padding: 15px;
border: 1px solid #ccc;
border-radius: 3px;
margin-bottom: 10px;
width: 100%;
box-sizing: border-box;
font-family: montserrat;
color: #2C3E50;
font-size: 13px;
}
/*buttons*/
#msform .action-button {
width: 100px;
background: #67d5bf;
font-wei.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0