jquery实现一个带进度的在线答题测验出结果代码
代码语言:html
所属分类:其他
代码描述:jquery实现一个带进度的在线答题测验出结果代码
代码标签: jquery 进度 在线 答题 测验 结果 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
.main-quiz-holder {
margin:0 auto;
position:relative;
background:#FCFCFC;
border:1px solid #dedede;
box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
-o-box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
-webkit-box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
-moz-box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
border-radius:20px 2px 20px 2px;
position:relative;
width:600px;
}
.main-quiz-holder * {
margin:0;
padding:0;
font-family:"Microsoft yahei",sans-serif;
}
.main-quiz-holder a {
text-decoration:none;
color:#6C6C6C;
}
.main-quiz-holder .slide-container {
width:500px;
padding:20px 50px 50pt 50px;
}
.results-container,.intro-container {
text-align:center;
}
.results-container {
}.main-quiz-holder .slide-container .question,.main-quiz-holder h2.qTitle {
margin:10px 0 20px 0;
font-size:20px;
font-weight:normal;
}
.main-quiz-holder h2.qTitle {
font-size:20px;
margin-top:30px;
line-height:26px
}
.main-quiz-holder .question-number {
position:absolute;
right:10px;
top:10px;
border:1px solid #F6F6F6;
padding:5px;
background:#F0F0F0;
text-shadow:0 1px 0 rgba(255,255,255,0.3);
-webkit-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
border-radius:3px;
color:#949494;
}
.main-quiz-holder .slide-container ul.answers {
margin:0px;
padding:5px;
list-style:none;
}
.main-quiz-holder .slide-container ul.answers li {
cursor:pointer;
padding:5px 30px;
margin:12px 0;
color:#4c4c4c;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
text-shadow:0 1px 0 rgba(255,255,255,0.3);
-webkit-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
background:#f6f6f6;
background:-webkit-gradient(linear,left top,left bottom,from(#f6f6f6),to(#d4d4d4));
background:-webkit-linear-gradient(#f6f6f6,#d4d4d4);
background-image:-moz-linear-gradient(top,#f6f6f6,#d4d4d4);
background-image:-moz-gradient(top,#f6f6f6,#d4d4d4);
border:1px solid #a1a1a1;
}
.main-quiz-holder .slide-cont.........完整代码请登录后点击上方下载按钮下载查看
网友评论0