深圳网站建设深圳网络公司,威海城市 建设信息网站,校园网站建设的参考文献,网站建设合同细节原理#xff1a;其实就是规定元素的四个边框颜色及边框宽度#xff0c;将元素宽高设置为0。如果要哪个方向的三角形#xff0c;将对应其他三个方向的边框宽和颜色设置为0和透明transparent即可
1.元素设置边框#xff0c;宽高#xff0c;背景色
style.border {w…原理其实就是规定元素的四个边框颜色及边框宽度将元素宽高设置为0。如果要哪个方向的三角形将对应其他三个方向的边框宽和颜色设置为0和透明transparent即可
1.元素设置边框宽高背景色
style.border {width: 50px;height: 50px;border: 2px solid;border-color: #96ceb4 #ffeead #d9534f #ffad60;} /stylebodydiv classborder/div
/body 元素 边框为2px的四个方向颜色不同
2.将元素宽高设置为0边框宽设置为50px .border {width:0;height: 0;
//注意solid也要设置border: 50px solid;border-color: #96ceb4 #ffeead #d9534f #ffad60;} 元素变为四个三角形组合
3. 设置上、左、右透明度为transparent且设置右和下的边框 .border {width:0;height: 0;border-style: solid;/* border-width: 0 50px 50px 0; */border-width: 0 50px 50px;/* border-color: transparent transparent #d9534f transparent; */border-color: transparent transparent #d9534f;position: relative;} 只要修改对应两边边框和该方向上以外的透明度即可
