border-box说明你定义的宽度是border+padding+content，所以包含文字的这块content会下移。而background是第三层，包含padding和content的，所以灯笼就不下移。

width: 45vw;

height: 47.2vh;/*原来高度-内边距*/

z-index: 0;

font-size: 3.506rem;

color: #fff;

text-align: center;

position: absolute;

top: -2%;

right: 0;

left: 0;

margin: auto;

background: url(../img/p1_lantern.png) no-repeat center bottom;

background-size: 100%;

padding-top: 24vh;

box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。

例如，假如您需要并排放置两个带边框的框，可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。

这个兼容性不好，所以我没用。我用的高度减去 内边距的高度。