视口计算

calc方法

• 写法

  属性名: calc(表达式);
  

• 表达式: 只能用加减乘除，计算后返回最终的px值

• 注意

  • + 和 - 前后必须有空格
  • * 和 / 前后可以没空格，但建议保留

全屏幕单位

对于 375 * 812 的手机屏幕

• 横向宽度

  • 书写: 100vw
  • 返回: 375px

• 纵向高度

  • 书写: 100vh
  • 返回: 812px

对全屏幕横向均分

• 要求:

  • 左右边距8px
  • 均分7份

• 实现:

  width: calc((100vw - 2 * 8px) / 7);