Div底部的中心三角形

Div底部的中心三角形

您不能只是设置

left

为

50%

，然后

margin-left

设置

-25px

为考虑其宽度：

.hero:after {    content:'';    position: absolute;    top: 100%;    left: 50%;    margin-left: -50px;    width: 0;    height: 0;    border-top: solid 50px #e15915;    border-left: solid 50px transparent;    border-right: solid 50px transparent;}

或者，如果您需要可变宽度，则可以使用：

.hero:after {    content:'';    position: absolute;    top: 100%;    left: 0;    right: 0;    margin: 0 auto;    width: 0;    height: 0;    border-top: solid 50px #e15915;    border-left: solid 50px transparent;    border-right: solid 50px transparent;}