day05 margin-top问题 + 表单元素(登录页,lable,单选框,复选框,下拉选框)

1 margin的一点小问题

2 上面的元素的margin-bottom和下面元素的margin-top会重合

3 绝对路径和相对路径

绝对路径：从盘符开始的路径
![](D:/images/down.jpg)
相对路径：相对当前文件所在的路径
同级目录    src='down.jpg'
下一级目录 src='images/down.jpg'
上一级目录 src='../down.jpg'

4 HTML表单相关元素

4.1一个登陆页面 label

    
    

        用户名
    
    

        密码
    
    

        
    


/* 标签为 input 元素定义标注（标记）。
label 元素不会向用户呈现任何特殊效果。
不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件
 标签的 for 属性应当与相关元素的 id 属性相同。*/

4.2单选框

    
    

        男
        女
    

4.3复选框

    

        爱好:
         游泳
         开车
         撩妹
    

4.4下拉选框

    上海
    北京
    武汉
    南京

预选的下拉选框
//在想要的option上加selected这个属性

4.5文本域

    


 /*写在一行不出现问题*/

4.6特殊字符的显示 &

 < > 
 /*可显示符号 >*/
hello   world 
 /*可显示空格 >*/
更多符号 可见 &下拉选项

5 标签之间的相互转换

display:inline|block|inline-block

6 display和visibility的区别

display: none; 去除元素
visibility: hidden; 隐藏元素

7 输入框和按钮的区别

    
//输入框可以填充,按钮不行,要使输入框和按钮一样大需要考虑输入框的边框

8 中间文字两边线效果

.line>fieldset{
    border-top: 1px solid #E0E0E0;
    width: 332px;
    margin-top: 100px
}
fieldset{border: none;}


    

        
其他登录方式