样式组件中的 CSS calc()

Question

试试这个：

const styledDiv = styled.div`
  ${props => props.takeViewportHeight && `min-height: calc(100vh-16px);`}
`

它不起作用。我是否在样式组件中遗漏了有关 calc 的内容？

Answer 1

关于 CSS 的一个有趣提示calc：

+/- 之间需要空格

意义：

const styledDiv = styled.div`
  ${props => props.takeViewportHeight && `min-height: calc(100vh - 16px);`}
`

应该管用