【CSS】

• 上下、左右居中一个元素，适用于任何场景

• position有哪些值

  • static: 默认值。没有定位，元素出现在正常的流中(top right bottom left 和 z-index对这样的元素无效)
  • relative: 相对定位。相对其正常位置进行定位，元素位置由top right bottom left 和 z-index决定
  • absolute: 绝对定位。相对于第一个不是static定位的父元素定位，元素位置由top right bottom left 和 z-index决定
  • fixed: 绝对定位。相对浏览器窗口进行定位，元素位置由top right bottom left 和 z-index决定
  • inherit: 继承父元素的position属性值

• 谈谈盒子模型（标准和IE）

  div {    margin: 10px;    border: 1px solid red;    padding: 5px;    width: 50px;    height: 30px;    background: pink;  }复制代码

  • 标准盒子模型：

  • ie盒子模型：

• 怎么用css画一个三角形

  html

        
  复制代码

  css

  div {    width: 0;    height: 0;  }  .triangle1 {    border-top: 100px solid red;    border-right: 100px solid blue;    border-bottom: 100px solid goldenrod;    border-left: 100px solid pink;  }复制代码

• 怎样实现一个盒子里两个div,左边固定宽度，右边自适应宽度

  html

        
      
         
      
         
    
        
  复制代码

  css

  // 通用的 .parent {    width: 100%;    height: 100px;  }  .left {    width: 100px;    background: pink;    height: 100%;  }  .right {    background: palegreen;    height: 100%;  }  /* 法1 左边浮动 */  .left {    float: left;  }  /* 法2 左边绝对定位 */  .parent {    position: relative;  }  .left {    position: absolute;  }  .right {    width: calc(100% - 100px);    margin-left: 100px;  }  /* 法3 右边绝对定位 */  .parent {    position: relative;  }  .right {    position: absolute;    width: calc(100% - 100px);    left: 100px;    top: 0;  }复制代码