浮动+定位+溢出+z-index+透明度了解

浮动

浮动之页面布局

行内行外一行显示

/*display: inline-block; */ 不推荐使用

左右浮动

float: left; 
float: right; 

实际应用

浮动的负面影响

# 浮动带来的负面影响
"""
	会造成父标签塌陷!!!
"""
  解决浮动的负面影响
    1.再写一个div撑场面(不可取)
    2.关键词clear(可以使用)
    3.通过解决策略(推荐使用):只要父标签塌陷了就使用
        

关键词clear:

通过解决策略

.clearfix:after {
    content: '';
    clear: both;
    display: block;
}

	



# 实操



    
    
    



    

    




"""
	自定义浮动边距为0,所以d1,d2中间没有空隙
"""

定位

静态定位 static
	所有的标签'默认'都是静态定位即不能改变位置
相对定位 relative
	相对标签原来的位置做定位
绝对定位 absolute
	相对已经定位过的父标签做定位(没有则参考body标签)
固定定位 fixed
	相对浏览器窗口做定位
    
  如何使用css完成定位
	定位关键字position
    位置关键字left,right,top,bottom

实例

    
    
    


    

        
啥也没有
    
    
回到顶部

是否脱离文档流

#标签位置改变之后 原来的位置是否会空出来
	如果空出来被其他标签自动占有
    
浮动、定位
	脱离文档流
    	浮动、绝对定位、固定定位
    不脱离文档流
    	相对定位

溢出属性

实操

# 需要要导入文件



    
    
    


    

        
    

z-index属性

# 浏览器平面不是一个二维坐标系而是一个三维坐标系
eg:百度登录或者退出界面>>>:三明治结构(模态框)

实操

    
    
    


我是最底层的文本内容


    
注册页面
    

        
username:
            
        
        
password:
            
        
        
    

透明度

rgba(124,124,124,0.5)
	只影响颜色
opacity:0.5
    影响颜色和字体

实操

    
    
    


    

        快要吃饭了 好激动
    
    

        人生的意义和价值在哪里
    

JavaScript

# JavaScript简称JS 与Java没有关系!
# JS是一门编程语言
# JS是一门编程语言但是逻辑非常的不严谨
# JS很容易...

JavaScript补充

类中引入方式
	1.script标签内直接编写(学习时使用)
    2.script标签src属性导入外部js文件(最正规)
    
  注释语法
		html:
        css:/**/
        JS://单行	/*多行*/
        # 模板注释语法