1. 边框

  2. 多重边框1

    
  <div class="outer">
    <div class="inner"></div>
  </div>

  3. 多重边框-点线、虚线（dotted dashed solid double groove ridge ridge inset outset）

  4. 多重边框 outline-offset 属性

  5. 多重边框 outline 圆角

  6. 多重边框 box-shadow 投影

          
    box-shadow:5px 10px 10px #aed581;

  7. 多重边框 box-shadow 双重边框

          
    box-shadow:inset x-offset y-offset blur-radius spread-radius color
    box-shadow:投影方式 X轴偏移量 Y轴偏移量 投影模糊半径 投影扩展半径 投影颜色
    投影方式默认是外阴影，设置 inset 表示内投影，x-offset 水平偏移值，可正可负
    y-offset 垂直偏移值，可正可负，blur-radius 只支持正值，spread-radius可正可负
    负数表示向里收缩
      
    
    
    box-shadow:0 0 0 10px #aed581;

  8. 多重边框 box-shadow 多重边框

    
    box-shadow: 0 0 0 10px #aed581,
                0 0 0 15px #f48fb1,
                0 0 0 25px #81d4fa;

  9. 多重边框 box-shadow 多重边框-圆角

    
    box-shadow: 0 0 0 10px #aed581,
                0 0 0 15px #f48fb1,
                0 0 0 25px #81d4fa;
    border-radius: 20px;