一、CSS图形
1.1、三角形
width: 0px;
height: 0px;
border-width: 0px 0px 40px 40px;
border-style: solid;
border-color: transparent transparent transparent red;
不是太懂,搞了个自己觉得明白的逻辑,将boder分为8个部分,如要显示右下,将border-color的右设置为有颜色,再将border-width的右和下设置为有粗细。
1.2、带边框三角形
#blue:after {
content: "";
width: 0;
height: 0;
position: absolute;
top: 0px;
left: 0px;
border-width: 0 40px 40px;
border-style: solid;
border-color: transparent transparent yellow;
}
修改top和left以达到重叠效果
2、圆
border-radius属性