企业官网建设流程全解析

div（height: 100vh; width: 100vw;）包裹一个 input （height: 100vh; width: 100vw;）

input 设置了边框 border: 1px solid rgb(234, 11, 11); 但显示效果，下边框被挤没了，没有显示。

设置了 box-sizing: border-box; 但是没用，渲染不对。

猜测可能是这个原因：当宽度或高度使用百分比时，浏览器可能无法正确计算盒模型。

没办法只能想一些笨办法了。

解决方法一：设置 height 为动态的

height: shadow ? `100vh` : `calc(100vh - 1px)`

但是需要依赖变量判断，变量多了会出 bug。

解决方法二：height 值变小

height: 96vh

看着没变化，是因这外面 div 设置透明的，所以不影响。

div 加了背景色是上面效果，不影响显示，还可以接受。