day02-作业

作业1：用网页来写笔记

    
        
        
        
        
        
    
    
        

            
day02_html和css总结
            
            

                

                    
表单标签
                    
input标签
                    
下拉列表标签
                    
表单分组
                    
空白标签
                    
认识css
                    
css选择器
                    
伪类选择器
                
            
            
            

                

                    一.表单标签:form
                
                

                    

                        1.可以提交表单中收集的信息

                        action属性：设置提交信息的位置

                        method属性：提交方式 -- post/get 

                    
                
                
                

                    二.input标签
                
                

                    

                        input标签（单标签） -- text（文本输入框）

                        1.是表单标签

                        2.type属性

                        text -- 普通的文本输入框

                        3.name属性必须设置（a.用于提交信息）

                        4.value属性：标签内容

                        5.placeholder属性：输入框提示信息

                        6.maxlength:输入框最多能输入的字符个数

                        7.readnoly:readonly -- 输入框只读（不能往里面输入内容）
                    
                    

                        input标签 -- password(密文输入)

                        1.type属性：password --- 输入的值是密文显示
                    
                    

                        input标签：单选按钮

                        1.type属性：radio ---单选

                        2.name属性：同一类型对应的name值必须一样

                        3.value属性：设置选中按钮提交的值

                        4.checked:设置为checked，让按钮默认处于选中状态
                    
                    

                        input标签：多选按钮

                        1.type属性：checkbox
                        2.name属性：同一类型对应的name值必须一样
                    
                    

                        input标签：普通按钮

                        1.type属性：button
                        2.disabled:disabled -- 按钮不能点击
                    
                    

                        input标签：重置按钮

                        1.type:reset  -- 将当前所在form中的所有表单相关标签对应的值，回到最初的状态
                    
                    

                        input标签：文件域
                        1.type:file
                    
                
            
                

                    三.下拉列表标签:select-option
                
                

                    

                        select:select -- 默认选中

                    
                
                
                

                    四.表单分组:fieldset
                
                

                    

                        一个fieldset标签对应一个表单分组

                        legend标签：设置分组名

                    
                
                
                

                    五.空白标签:div和span
                
                

                    

                        div标签：是空白标签，没有任何特殊的意义(无语义标签) 

                        span标签：是空白标签

                    
                
                
                

                    六.认识css
                
                

                    

                        1.什么是CSS

                        css是web标准中的表现标准，用来设置网页上标签的样式（什么样，在哪）

                        css代码/css文件，我们叫样式表

                        目前我们使用的是css3。还是标记语言
                    
                    

                        2.写在那

                        内联样式表：将css代码写在标签的style属性中

                        内部样式表：写在head标签中的style标签的内容中

                        外部样式表：写在一个css文件中，通过head中 的link标签来关联

                        
                        优先级：内联的优先级最高，内部和外部没有绝对的优先，主要看同一属性那个最后赋值，那个就优先级高
                    
                    

                        3.怎么写

                        选择器{属性：属性值；属性：属性值；}     

                        选择器：用来选中需要设置样式的标签

                        属性：css属性

                        属性值：如果属性值是数字，表示的是大小要在后面加px  

                        注意：每个属性之间用分号隔开，否则属性无效

                            
                        补充属性：color：设置字体颜色    background-color:设置背景颜色    width：标签宽度    height：标签的高度
                    
                    
                
                
                

                    七.css选择器
                
                

                    

                        1.元素选择器（标签选择器）：标签名{} 

                            选中所有的标签名对应的标签

                        
                        2.id选择器：#id{} 

                            每个标签都有一个id属性，整个html中id的值必须唯一

                        
                        3.class选择器：.class属性值

                            每个标签都有一个class属性，

                        
                        4.通配符：*{} 

                            选中所有的标签

                        
                        5.层级选择器：选择器1 选择器2,...{} 

                        
                        6.群组选择器：选择器1，选择器2,...{} 

                    
                
                
                

                    八.伪类选择器
                
                

                    

                        伪类选择器：选择器：状态

                            link：超链接的初始状态； -- 一次都没有访问成功的时候的状态

                            visited：超链接的访问后的状态； -- 已经访问成功后的状态

                            hover：鼠标悬停在标签上的时候对应的状态

                            active：鼠标按住时的状态

                        
                        给同一个标签通过伪类选择器给不同状态设置不同样式的时候，要遵守爱恨原则

                        LoVe HAte 

                    
                
                
            
  
        
        
        
    

作业2：登录界面

    
        
        
        
        
    
    
        

            
        
        

            
            

                密码登录

                用户名：

                密    码：

                
                

                    
                    登录
                
                
                
            
            
        
    

登录.png