CSS04_王娇语——0209

• CSS中使用box-shadow属性
  

• 属性值：
  
  • h-shadow 必须值 水平阴影位置
  • v-shadow 必须值 垂直阴影位置
  • blur  可选  模糊距离
  • spread 可选 阴影尺寸
  • color 可选  阴影颜色
  • inset  可选 将外部阴影改为内部阴影   默认值是outset 但是outset不能写在box-shadow中，否则阴影失效。
    

• 注意：盒子阴影不会占用空间， 不会影响其他盒子的排列
• CSS的传统布局方式
  
  • 普通流（标准流）
    
  •   比如说块级盒子自己占一行，行内元素一行会显示多个，标准流就是最基本的布局方式。
    
  • 浮动
  • 定位
    
• 浮动
  
  • 为什么需要浮动？
    
  • 可以让多个盒子水平排列成一行，而且中间没有空白间隙
    
  • 浮动的属性
    
• float属性值
• none 元素没有浮动（默认值）
• left
• right
  
  • 注意点
    
• 
  
  • 在网页布局时，纵向找标准流，横向找浮动。
    
  • 浮动的特性
    
    • 浮动的元素会脱离标准流（脱标）
      
    • 浮动的元素一行内显示并且沿元素顶部对齐
      
    • 浮动的元素会行内块元素的特定
      
    • 浮动的盒子会压住后面的标准流盒子，但是不会压住文字（原因是：浮动的技术研发之初就是为了实现文字环绕的）
      
    • 浮动的盒子只会影响它后面的标准流，不会影响前面的标准流。
      
  • 浮动的注意点
    
    • 1、浮动的盒子和标准流盒子搭配的方法
      
      • 父级盒子用标准流进行上下排列，子盒子采用浮动来进行横向排列
        
    • 2、一个元素浮动了，理论上其余的兄弟元素也都需要浮动
      
      • 因为浮动的盒子会脱标， 如果兄弟盒子只浮动了一个，那么会影响后面的其他兄弟盒子
        
• 清除浮动
  
  • 1、额外标签法
    
    • 额外标签法也称为隔墙法，是W3C推荐的做法。
      
    • 在浮动元素的末尾添加一个空标签，这个空标签要求必须是块级元素。
      
  • 2、给父级添加overflow:hidden属性
    
  • 3、给父级添加after伪元素
    
  • 4、给父级添加双伪元素