css3三角在呢么谢,能不能用 CSS3 画出以下图形？感谢！

我也来贡献个答案吧。主要是减少输入的计算变量，只需考虑修复 .quote 的高度以及圆角的宽度

.quote {

position: relative;

width: 100%; /* any width */

height: 40px;/* fix zero height */

}

.quote::before, .quote::after, .quote ::before, .quote ::after {

content: '';

display: block;

position: absolute;

width: calc(50% - 20px);

height: 20px;

border-style: solid;

border-color: #000;

border-width: 0;

}

.quote ::before, .quote ::after {

top: 0;

border-bottom-width: 1px;

}

.quote::before, .quote::after {

top: 20px;

border-top-width: 1px;

}

.quote ::before {

left: 0;

border-bottom-left-radius: 20px;

}

.quote ::after {

right: 0;

border-bottom-right-radius: 20px;

}

.quote::before {

left: 20px;

border-top-right-radius: 20px;

}

.quote::after {

right: 20px;

border-top-left-radius: 20px;

}