《HTML5实战》Lesson02

Week02     2016/09/21上午1-4节

一、Modernizr.js的作用

解决不支持css3+html5浏览器的兼容性

Modernizr.js:为HTML5和CSS3而生！-前端开发博客

Modernizr的介绍和使用-刘一痕-ChinaUnix博客

Modernizr.js入门指南 - 推酷

二、Modernizr.js的下载

官方网站：

Modernizr: the feature detection library for HTML5/CSS3

GitHub - Modernizr/Modernizr: Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser.

三、Lesson02创建表单

HTML 5 教程

1，index.html

(1)引用外部css文件

(2)引用外部js文件

(3)form:name,method(get,post),action

(4)input:name,id,type,value,placeholder,required,autofocus

(5)fieldset,legend

(6)ul,li

(7)select,option

(8)input type:email,tel

(9)实体符号： 

(10)在dreamwaver内添加Goolge 浏览器

四、运行代码-----P42：代码清单2-2

    
    
 
    
    

 

     
Order Form
        

         
Contact Details
       
            

                

                    
                        
FULL Name
                        
                    
                

                

                    
                        
Email Address
                        
                    
                

                

                    
                        
Postal Address
                        
                        
 
                        
                        
 
                        
                        
                        
                        
 
                        
                            Country
                            China
                            United States
                            Canada
                        
                    
                

                

                    
                        
Home Phone No.
                        
                    
                

                

                    
                        
Cell Phone No.
                        
                    
                

                

                    
                        
Skype Name
                        
                    
                

                

                    
                        
Twitter
                        @
                        
                    
                

            
         
       
        

         
            
        
    

五、运行效果：IE10.0 ,Google Chrome10.0,FireFox 4.0以上