在线调查答题页面设计

code format="html4strict" <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   测测你的职业前景_育儿网  body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;} body,button,input,select,textarea{font:12px arial,\5b8b\4f53,sans-serif;} h1,h2,h3,h4,h5,h6{font-size:100%;}address,cite,dfn,em,var{font-style:normal;}code,kbd,pre,samp{font-family:courier new,courier,monospace;}small{font-size:12px;}ul,ol{list-style:none;}a{text-decoration:none;}a:hover{text-decoration:underline;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}legend{color:#000;}fieldset,img{border:0;}button,input,select,textarea{font-size:100%;}table{border-collapse:collapse;border-spacing:0;}.col-main{float:left;width:100%;min-height:1px;}.hidden{display:none;}.invisible{visibility:hidden;} .clear:after{content:'\20';display:block;height:0;clear:both;}.clear{*zoom:1;font-size:0;clear:both;} a:link,a:visited{color:#000;text-decoration:none;} a:hover{color:#c00;text-decoration:underline;} img{border:0;-ms-interpolation-mode:bicubic;} .clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden} body{background:#0072d3 url(images/body_bg.jpg) repeat-x;} body .head{height:24px;background:#349cf9;} body .top{width:960px;line-height:24px;margin:0 auto;} body .top a:link,.top a:visited{color:#ffffff;} body .top .l{float:left;} body .top .l li{padding:0 8px;margin-right:10px;float:left;} body .top .r{padding:0 8px;float:right;}
 * html>body .clearfix{display:inline-block;width:100%}
 * html .clearfix{/* Hides from IE-mac \*/ height:1%;/* End hide from IE-mac */ }
 * +html .clearfix{min-height:1%}

body .main,body .pic{width:960px;margin:0 auto;} body .main{width:958px;background:#edede3;border:1px solid #0064b9;padding-bottom:20px;} body .main div{margin-bottom:20px;} body .main dl{padding:0 30px;color:#6a4c18;font-size:14px;line-height:36px;} body .main dd{height:36px;} body .main dt{font-weight:bold;}

body .main label{cursor:pointer;color:#000;} body .main label.red{color:#c00;}  function check(m,i){ var score='x'; var n=0; var j=0; if(m==1){ n=1; j=11; }else if(m==2){ n=11; j=21; }else{ n=21; j=29; }	while(n<j){ var v=getv(n); if(v){ n++; }else{ if(i==10||i==20||i==28){ alert('第'+n+'题没有填写！'); }			return false; }	}	if(m==1){ goTop(0.2); $('#box1').hide; $('#box2').show; }else if(m==2){ goTop(0.2); $('#box2').hide; $('#box3').show; }else{ var num=1; var score='x'; while(num<29){ score=score+'.'+getv(num); num++; }		var s=score; window.location="result.php?v=1&t="+s; } } function getv(n){ var radioes=document.getElementsByName('a'+n); for(var i=0;i<radioes.length;i++){ if(radioes[i].checked){ return radioes[i].value; }	} } function goTop(acceleration, time){ acceleration = acceleration || 0.2; time = time || 16; var x1 = 0; var y1 = 0; var x2 = 0; var y2 = 0; var x3 = 0; var y3 = 0; if(document.documentElement){ x1 = document.documentElement.scrollLeft || 0; y1 = document.documentElement.scrollTop || 0; }	if(document.body){ x2 = document.body.scrollLeft || 0; y2 = document.body.scrollTop || 0; }	var x3 = window.scrollX || 0; var y3 = window.scrollY || 250; // 滚动条到页面顶部的水平距离 var x = Math.max(x1, Math.max(x2, x3)); // 滚动条到页面顶部的垂直距离 var y = Math.max(y1, Math.max(y2, y3)); // 滚动距离 = 目前距离 / 速度, 因为距离原来越小, 速度是大于 1 的数, 所以滚动距离会越来越小 var speed = 1 + acceleration; window.scrollTo(Math.floor(x / speed), Math.floor(y / speed)); // 如果距离不为零, 继续调用迭代本函数 if(x > 0 || y > 250){ var invokeFunction = "goTop(" + acceleration + ", " + time + ")"; window.setTimeout(invokeFunction, time); } }
 * 1) box2,#box3{display:none;}

育儿网微博 更多应用  育儿网——全球最大中文育儿网 

<img src="images/list.jpg" width="960" height="40"/> <dl> <dt>第1题　我倾向从何处得到力量：</dt> <dd> <input type="radio" id="aa11" name="a1" value="E" onclick="check(1,1)" /> <label for="aa11" onmouseover="this.className='red'" onmouseout="this.className=''"> 别人.

</dd> <dd> <input type="radio" id="aa12" name="a1" value="I" onclick="check(1,1)" /> <label for="aa12" onmouseover="this.className='red'" onmouseout="this.className=''"> 我自己的想法. </dd> </dl> <dl>

<dt>第2题　当我参加一个社交聚会时，我倾向于：</dt> <dd> <input type="radio" id="aa21" name="a2" value="E" onclick="check(1,2)" /> <label for="aa21" onmouseover="this.className='red'" onmouseout="this.className=''"> 玩的开心时，很晚才愿意回家！ </dd> <dd> <input type="radio" id="aa22" name="a2" value="I" onclick="check(1,2)" />

<label for="aa22" onmouseover="this.className='red'" onmouseout="this.className=''"> 当天变黑时，我就疲倦了并且想回家. </dd> </dl> <dl> <dt>第3题　下列哪一种听起来比较吸引人？</dt> <dd> <input type="radio" id="aa31" name="a3" value="E" onclick="check(1,3)" />

<label for="aa31" onmouseover="this.className='red'" onmouseout="this.className=''"> 与我的爱人到热闹，经常有互动活动的地方. </dd> <dd> <input type="radio" id="aa32" name="a3" value="I" onclick="check(1,3)" /> <label for="aa32" onmouseover="this.className='red'" onmouseout="this.className=''"> 待在家中与我的爱人做一些简单的事情，例如一边观看有趣的电影，一边吃美味的食物 </dd>

</dl> <dl> <dt>第4题　在约会中，我通常：</dt> <dd> <input type="radio" id="aa41" name="a4" value="E" onclick="check(1,4)" /> <label for="aa41" onmouseover="this.className='red'" onmouseout="this.className=''"> 很健谈 </dd>

<dd> <input type="radio" id="aa42" name="a4" value="I" onclick="check(1,4)" /> <label for="aa42" onmouseover="this.className='red'" onmouseout="this.className=''"> 一开始很安静，慢慢才会话多起来 </dd> </dl> <dl> <dt>第5题　我倾向于在什么地方与我的爱人第一次相遇：</dt>

<dd> <input type="radio" id="aa51" name="a5" value="E" onclick="check(1,5)" /> <label for="aa51" onmouseover="this.className='red'" onmouseout="this.className=''"> 在宴会中、夜总会、工作上、休闲活动中、会议上、朋友聚会中. </dd> <dd> <input type="radio" id="aa52" name="a5" value="I" onclick="check(1,5)" /> <label for="aa52" onmouseover="this.className='red'" onmouseout="this.className=''">

透过私人的方式，例如个人广告、视频聊天、或是由亲密的朋友和家人介绍. </dd> </dl> <dl> <dt>第6题　我倾向于：</dt> <dd> <input type="radio" id="aa61" name="a6" value="E" onclick="check(1,6)" /> <label for="aa61" onmouseover="this.className='red'" onmouseout="this.className=''">

认识很多人，并且有很多好朋友 </dd> <dd> <input type="radio" id="aa62" name="a6" value="I" onclick="check(1,6)" /> <label for="aa62" onmouseover="this.className='red'" onmouseout="this.className=''"> 认识一些人，不需要太多好朋友 </dd> </dl>

<dl> <dt>第7题　我的爱人倾向对我说这些：</dt> <dd> <input type="radio" id="aa71" name="a7" value="E" onclick="check(1,7)" /> <label for="aa71" onmouseover="this.className='red'" onmouseout="this.className=''"> 你难道不可以安静一点吗？ </dd> <dd>

<input type="radio" id="aa72" name="a7" value="I" onclick="check(1,7)" /> <label for="aa72" onmouseover="this.className='red'" onmouseout="this.className=''"> 你为什么话这么少？ </dd> </dl> <dl> <dt>第8题　我倾向于相信这样的信息：</dt> <dd>

<input type="radio" id="aa81" name="a8" value="N" onclick="check(1,8)" /> <label for="aa81" onmouseover="this.className='red'" onmouseout="this.className=''"> 周围听说的，网上报道的可能发生的事情. </dd> <dd> <input type="radio" id="aa82" name="a8" value="S" onclick="check(1,8)" /> <label for="aa82" onmouseover="this.className='red'" onmouseout="this.className=''"> 确确实实发生了，真是可靠的事情

</dd> </dl> <dl> <dt>第9题　我倾向于相信：</dt> <dd> <input type="radio" id="aa91" name="a9" value="N" onclick="check(1,9)" /> <label for="aa91" onmouseover="this.className='red'" onmouseout="this.className=''"> 我的直觉.

</dd> <dd> <input type="radio" id="aa92" name="a9" value="S" onclick="check(1,9)" /> <label for="aa92" onmouseover="this.className='red'" onmouseout="this.className=''"> 我直接的观察和现成的经验. </dd> </dl> <dl>

<dt>第10题　当我置身于一段关系中时，我倾向相信：</dt> <dd> <input type="radio" id="aa101" name="a10" value="N" onclick="check(1,10)" /> <label for="aa101" onmouseover="this.className='red'" onmouseout="this.className=''"> 永远有进步的空间. </dd> <dd> <input type="radio" id="aa102" name="a10" value="S" onclick="check(1,10)" />

<label for="aa102" onmouseover="this.className='red'" onmouseout="this.className=''"> 若它没有被破坏，不要去修补它. </dd> </dl>

<img src="images/list1.jpg" width="960" height="40"/> <dl>

<dt>第11题　当我对一个约会觉得放心时，我倾向谈论：</dt> <dd> <input type="radio" id="aa111" name="a11" value="N" onclick="check(2,11)" /> <label for="aa111" onmouseover="this.className='red'" onmouseout="this.className=''"> 未来，新奇的事物！比如高科技概念产品. </dd> <dd> <input type="radio" id="aa112" name="a11" value="S" onclick="check(2,11)" />

<label for="aa112" onmouseover="this.className='red'" onmouseout="this.className=''"> 实际的，具体的，关于「此时此地」的事物. 例如说，今天做了什么，或我将去哪儿旅游. </dd> </dl> <dl> <dt>第12题　我是这种类型的人：</dt> <dd> <input type="radio" id="aa121" name="a12" value="N" onclick="check(2,12)" />

<label for="aa121" onmouseover="this.className='red'" onmouseout="this.className=''"> 喜欢先看整个大局面. </dd> <dd> <input type="radio" id="aa122" name="a12" value="S" onclick="check(2,12)" /> <label for="aa122" onmouseover="this.className='red'" onmouseout="this.className=''"> 喜欢先拿握细节. </dd>

</dl> <dl> <dt>第13题　我是这种类型的人：</dt> <dd> <input type="radio" id="aa131" name="a13" value="N" onclick="check(2,13)" /> <label for="aa131" onmouseover="this.className='red'" onmouseout="this.className=''"> 与其活在现实中，我选择活在我的想象里. </dd>

<dd> <input type="radio" id="aa132" name="a13" value="S" onclick="check(2,13)" /> <label for="aa132" onmouseover="this.className='red'" onmouseout="this.className=''"> 与其活在我的想象里，我选择活在现实中. </dd> </dl> <dl> <dt>第14题　如果我即将有个约会，我通常会：</dt>

<dd> <input type="radio" id="aa141" name="a14" value="N" onclick="check(2,14)" /> <label for="aa141" onmouseover="this.className='red'" onmouseout="this.className=''"> 想象一大堆即将发生在这个约会上的事情. </dd> <dd> <input type="radio" id="aa142" name="a14" value="S" onclick="check(2,14)" /> <label for="aa142" onmouseover="this.className='red'" onmouseout="this.className=''">

没什么想法，等待着约会的到来. </dd> </dl> <dl> <dt>第15题　我倾向如此做决定：</dt> <dd> <input type="radio" id="aa151" name="a15" value="F" onclick="check(2,15)" /> <label for="aa151" onmouseover="this.className='red'" onmouseout="this.className=''">

首先依我的直觉，然后依我的逻辑. </dd> <dd> <input type="radio" id="aa152" name="a15" value="T" onclick="check(2,15)" /> <label for="aa152" onmouseover="this.className='red'" onmouseout="this.className=''"> 首先依我的逻辑，然后依我的直觉. </dd> </dl>

<dl> <dt>第16题　我善于察觉到这样的状况：</dt> <dd> <input type="radio" id="aa161" name="a16" value="F" onclick="check(2,16)" /> <label for="aa161" onmouseover="this.className='red'" onmouseout="this.className=''"> 对方情感上心理上的变化. </dd> <dd>

<input type="radio" id="aa162" name="a16" value="T" onclick="check(2,16)" /> <label for="aa162" onmouseover="this.className='red'" onmouseout="this.className=''"> 对方做了不合逻辑的事. </dd> </dl> <dl> <dt>第17题　当和某人分手时. </dt> <dd>

<input type="radio" id="aa171" name="a17" value="F" onclick="check(2,17)" /> <label for="aa171" onmouseover="this.className='red'" onmouseout="this.className=''"> 我通常让自己的情绪深陷其中，很难抽身而出. </dd> <dd> <input type="radio" id="aa172" name="a17" value="T" onclick="check(2,17)" /> <label for="aa172" onmouseover="this.className='red'" onmouseout="this.className=''"> 虽然我觉得受伤，但一旦下定决心，我会直截了当地将过去恋人的影子甩开.

</dd> </dl> <dl> <dt>第18题　当与一个人交往时，我觉得哪方面更重要：</dt> <dd> <input type="radio" id="aa181" name="a18" value="F" onclick="check(2,18)" /> <label for="aa181" onmouseover="this.className='red'" onmouseout="this.className=''"> 相互之间的兴趣爱好

</dd> <dd> <input type="radio" id="aa182" name="a18" value="T" onclick="check(2,18)" /> <label for="aa182" onmouseover="this.className='red'" onmouseout="this.className=''"> 互相包容，互相理解 </dd> </dl> <dl>

<dt>第19题　当我不同意我爱人的想法时：</dt> <dd> <input type="radio" id="aa191" name="a19" value="F" onclick="check(2,19)" /> <label for="aa191" onmouseover="this.className='red'" onmouseout="this.className=''"> 我尽可能避免去伤害对方. 如果想说的话可能会伤害到对方，我就不会说出来 </dd> <dd> <input type="radio" id="aa192" name="a19" value="T" onclick="check(2,19)" />

<label for="aa192" onmouseover="this.className='red'" onmouseout="this.className=''"> 我通常毫无保留地说话，并且对我的爱人直言直语，因为对的就是对的. </dd> </dl> <dl> <dt>第20题　认识我的人倾向于这样形容我：</dt> <dd> <input type="radio" id="aa201" name="a20" value="F" onclick="check(2,20)" />

<label for="aa201" onmouseover="this.className='red'" onmouseout="this.className=''"> 热情、敏感. </dd> <dd> <input type="radio" id="aa202" name="a20" value="T" onclick="check(2,20)" /> <label for="aa202" onmouseover="this.className='red'" onmouseout="this.className=''"> 逻辑、明确. </dd>

</dl>

<img src="images/list2.jpg" width="960" height="40"/> <dl> <dt>第21题　我把大部分和别人的相遇视为：</dt> <dd> <input type="radio" id="aa211" name="a21" value="F" onclick="check(3,21)" />

<label for="aa211" onmouseover="this.className='red'" onmouseout="this.className=''"> 友善及重要的. </dd> <dd> <input type="radio" id="aa212" name="a21" value="T" onclick="check(3,21)" /> <label for="aa212" onmouseover="this.className='red'" onmouseout="this.className=''"> 另有目的. </dd>

</dl> <dl> <dt>第22题　若我有时间和金钱，我的朋友邀请我到国外度假，并且在一天前才通知，我会：</dt> <dd> <input type="radio" id="aa221" name="a22" value="J" onclick="check(3,22)" /> <label for="aa221" onmouseover="this.className='red'" onmouseout="this.className=''"> 先考虑下我最近的日程安排. </dd>

<dd> <input type="radio" id="aa222" name="a22" value="P" onclick="check(3,22)" /> <label for="aa222" onmouseover="this.className='red'" onmouseout="this.className=''"> 立即收拾行装，准备出发. </dd> </dl> <dl> <dt>第23题　在第一次约会中：</dt>

<dd> <input type="radio" id="aa231" name="a23" value="J" onclick="check(3,23)" /> <label for="aa231" onmouseover="this.className='red'" onmouseout="this.className=''"> 若我所约的人来迟了，我会很不高兴. </dd> <dd> <input type="radio" id="aa232" name="a23" value="P" onclick="check(3,23)" /> <label for="aa232" onmouseover="this.className='red'" onmouseout="this.className=''">

一点都不在乎，因为我自己就常常迟到. </dd> </dl> <dl> <dt>第24题　我偏好：</dt> <dd> <input type="radio" id="aa241" name="a24" value="J" onclick="check(3,24)" /> <label for="aa241" onmouseover="this.className='red'" onmouseout="this.className=''">

事先知道约会的行程：要去哪里、有谁参加、我会在哪里多久、该如何打扮. </dd> <dd> <input type="radio" id="aa242" name="a24" value="P" onclick="check(3,24)" /> <label for="aa242" onmouseover="this.className='red'" onmouseout="this.className=''"> 让约会自然地发生，不做先前太多的计划. </dd> </dl>

<dl> <dt>第25题　我喜欢过这样的生活：</dt> <dd> <input type="radio" id="aa251" name="a25" value="J" onclick="check(3,25)" /> <label for="aa251" onmouseover="this.className='red'" onmouseout="this.className=''"> 按着定好的日程表规律的生活. </dd> <dd>

<input type="radio" id="aa252" name="a25" value="P" onclick="check(3,25)" /> <label for="aa252" onmouseover="this.className='red'" onmouseout="this.className=''"> 不受约束，自然而然的生活. </dd> </dl> <dl> <dt>第26题　下面哪一项较为常见：</dt> <dd>

<input type="radio" id="aa261" name="a26" value="J" onclick="check(3,26)" /> <label for="aa261" onmouseover="this.className='red'" onmouseout="this.className=''"> 我准时出席而其它人迟到. </dd> <dd> <input type="radio" id="aa262" name="a26" value="P" onclick="check(3,26)" /> <label for="aa262" onmouseover="this.className='red'" onmouseout="this.className=''"> 其它人都准则出席而我迟到.

</dd> </dl> <dl> <dt>第27题　我是这样的人：</dt> <dd> <input type="radio" id="aa271" name="a27" value="J" onclick="check(3,27)" /> <label for="aa271" onmouseover="this.className='red'" onmouseout="this.className=''"> 相信自己做出的决定并且做出最后肯定的结论.

</dd> <dd> <input type="radio" id="aa272" name="a27" value="P" onclick="check(3,27)" /> <label for="aa272" onmouseover="this.className='red'" onmouseout="this.className=''"> 很开放，喜欢收集大家的意见，然后再做决定. </dd> </dl> <dl>

<dt>第28题　我是这类型的人：</dt> <dd> <input type="radio" id="aa281" name="a28" value="J" onclick="check(3,28)" /> <label for="aa281" onmouseover="this.className='red'" onmouseout="this.className=''"> 喜欢在一个时间里专心于一件事情直到完成. </dd> <dd> <input type="radio" id="aa282" name="a28" value="P" onclick="check(3,28)" />

<label for="aa282" onmouseover="this.className='red'" onmouseout="this.className=''"> 享受同时进行好几件事情. </dd> </dl> <script language="javascript" src="http://count27.51yes.com/click.aspx?id=270198122&logo=1" charset="gb2312"> <script language="javascript">document.write('<style type=text/css>.rightpos{position:absolute;top:170px;right:0;width:140px;background:#F5F5F5;border:#CCCCCC 1px solid;border-right:none;}.rightpos .rpt{height:30px;background:#ECECEC url(http://box.ci123.com/images/ci123.png) 16px 2px no-repeat;border-bottom:#CCCCCC 1px solid;}.rightpos ul,.rightpos li{list-style:none;margin:0;padding:0;}.rightpos ul{line-height:2em;padding:8px 0 12px 8px;font-size:12px;font-family:"宋体";color:#666;}.rightpos li a,.rightpos li a:visited{color:#008AD6;text-decoration:none;}.rightpos li a:hover{color:#c00;}.rightpos .rpr{color:#333333;font-weight:bold;padding-left:8px;} '); document.write(' <a href="http://www.ci123.com/" target="_blank" title="育儿网"><img src="http://box.ci123.com/images/space.gif" width="120" height="29" /></a>  热门好玩小测试：</li>·<a href=http://good.ci123.com/app/sina/card target=_blank>你活在那个证上？</a></li>·<a href=http://good.ci123.com/app/sina/eq target=_blank>风靡全球EQ测试</a></li>·<a href=http://good.ci123.com/app/sina/yali target=_blank>最流行压力测试</a></li>·<a href=http://good.ci123.com/app/sina/shili/index.php target=_blank>超囧眼力大测试</a></li>·<a href=http://good.ci123.com/app/sina/linghun/ target=_blank>死后，你魂归何处？</a></li>·<a href=http://good.ci123.com/app/sina/number2 target=_blank>测测你人生中的数字</a></li>·<a href=http://good.ci123.com/app/sina/yjk/ target=_blank>测测你的亚健康指数</a></li>·<a href=http://good.ci123.com/app/sina/chuanyue/ target=_blank>穿越，你准备好了吗？</a></li></ul> ');

code