HTML5 form表单 调查问卷制作

HTML 表格和表单综合应用技术练习：制作调查问卷（内含超详细代码解读）

这一篇来记录HTML5表格和表单综合应用的学习，以制作状况调查问卷为例，效果如图：

注：完整代码见文章末尾处。

外观加工

提交按钮：

.btn {
        width: 80px;
        height: 35px;
        border: none;
        background-color: #99ccff;
        color: #993564;
      }

完整代码：

    
    
    


    

        

            
状况调查问卷
            

                
个人基本信息
            
            

                

                    姓名:
                    
                
                

                    性别:
                    
                
                

                    年龄:
                    
                    18以下
                    
                    18-23
                    
                    24-28
                    
                    29-38
                
            
            

                

                    曾用名:
                    
                    （没有可不填）
                
                

                    婚姻状况：
                    
                    未婚
                    
                    已婚
                
                

                    宗教信仰：
                    
                    有信仰
                    
                    无信仰
                
            
            

                

                    政治面貌:
                    
                
                

                    联系电话:
                    
                
            
            

                

                    学历：
                    
                    初中或以下；
                    
                    高中或中专；
                    
                    大学本科；
                    
                    硕士；
                    
                    博士及以上；
                
            
            

                

                    所从事的行业状况？：

                    

                        
                        机关、事业单位职工
                        
                        企业、公司员工

                    
                    

                        
                        经商 
                        
                        自由职业  
                        
                        学生 
                        
                        其他
                    
                
            
            

                

                    你有什么个人爱好？

                    

                        阅读 
                        听音乐 
                        跑步
                    
                    

                        看电影
                        爬山  
                        其他