Question

我在主形状中添加了框阴影，但我无法正确地将其添加到构成多边形的:: before和：after三角形中。

当我尝试将box-shadow: 0 0 15px 1px #303030;添加到::before和::after形式时，它在包含pesduo元素的框周围给出了阴影

* {
     box-sizing: border-box;
}
 header {
     height: 100px;
     text-align:center;
     line-height: 100px;
     background-color: gold;
}
 form {
     box-shadow: 0 0 15px 1px #303030;
     background-color: lightgreen;
     margin: -10px auto;
     padding: 20px;
     width: 240px;
     position: relative;
}
 form::before {
     content: '';
     width: 0;
     height: 0;
     border-left: 20px solid transparent;
     border-right: 20px solid transparent;
     border-bottom: 20px solid lightgreen;
     position: absolute;
     top: -20px;
     left: 50%;
     margin-left: -20px;
}
 form::after {
     content: '';
     width: 0;
     height: 0;
     border-left: 120px solid transparent;
     border-right: 120px solid transparent;
     border-top: 70px solid lightgreen;
     position: absolute;
     bottom: -70px;
     left: 0;
}
 input {
     display: block;
     width: 100%;
}

Answer 1

请尝试也许对您有益-

((htonl(ip) >> 24) & 0xff)

链接到jsfiddle-http://jsfiddle.net/oj26aLmr/1/

如何在多边形的psedo元素周围添加框阴影？

1 个答案: