html css 矩形边框,html – CSS：在纯CSS箭头上创建边框

以下应该做你需要的

.multiply-button {

display: table;

background: rgba(0,0);

border: none;

color: white;

padding: 0;

}

.multiply-button-content {

display: table-cell;

background: green;

padding: 0 9px;

border: solid 1px black;

border-right: none !important;

position: relative;

vertical-align:middle;

height: 40px; /* double the border width */

Box-sizing: border-Box;

}

.multiply-button-content:after,.multiply-button-content:before {

left: 100%;

top: 50%;

border: solid transparent;

content: " ";

height: 0;

width: 0;

position: absolute;

pointer-events: none;

border-width: 20px 0 20px 12px;

margin-top: -20px;

}

.multiply-button-content:after {

border-color: rgba(0,128,0);

border-left-color: #008000;

margin-left: -1px;

}

.multiply-button-content:before {

border-color: rgba(0,0);

border-left-color: #000000;

}

Multiply