福鼎建设局网站首页,企业管理软件开发工具,网络营销论文3000字,怎么做自己的网站免费首先#xff0c;我们要会先实现一个小三角形#xff1b; 思路#xff1a;利用元素的 border 属性#xff0c;将其三个方向的 border-color 值设为透明色#xff08;或者和其父元素的背景色一致#xff0c;形成视觉差#xff0c;俗称障眼法#xff09;#xff0c;剩下…  首先我们要会先实现一个小三角形 思路利用元素的 border 属性将其三个方向的 border-color 值设为透明色或者和其父元素的背景色一致形成视觉差俗称障眼法剩下一个方向的 border-color 的值即为你需求的三角形的颜色。 重点 span 画一个三角形然后span 的伪类画一个和背景色一样的小一点点的三角形摞在一起注意一下z-index,然后就完成啦 div classselectspan/spandiv classselectItem汇总统计/divdiv classselectItem汇总统计/divdiv classselectItem汇总统计/divdiv classselectItem汇总统计/div/div style langless scoped.select {width: 218px;background: #012e30;box-shadow: 0px 18px 56px 16px rgba(0, 255, 236, 0.05), 0px 12px 32px 0px rgba(0, 255, 236, 0.08),0px 6px 12px -8px rgba(0, 221, 213, 0.12);// opacity: 0.9;border: 2px solid #00ffec;border-radius: 4px;position: absolute;top: 64px;right: 0px;z-index: 2;opacity: 0.9;span {display: block;width: 0;height: 0;border-top: 16px solid transparent;border-right: 16px solid transparent;border-bottom: 16px solid #00ffec;border-left: 16px solid transparent;position: absolute;right: 5px;top: -30px;::after {content: ;display: block;width: 0;height: 0;border-top: 14px solid transparent;border-right: 14px solid transparent;border-bottom: 14px solid #012e30;border-left: 14px solid transparent;position: absolute;right: -14px;top: -11px;z-index: 3;}} } .selectItem {line-height: 56px;padding-left: 12px;font-size: 24px;font-weight: 500;color: #ffffff; }/style