标签:
利用边框颜色覆盖(块级标签内联)的效果,取部分图案:如果把一侧的border去掉,还能形成半角。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" > < title ></ title > < style > .arrow{ display: inline-block; border-top: 10px solid black; border-right: 10px solid red; border-bottom: 10px solid pink; border-left: 10px solid blue; /*想要哪边箭头,直接把另外三边的颜色改成透明:transparent.*/ } </ style > </ head > < body > < div class = "arrow" ></ div > </ body > </ html > |
1 2 3 4 5 6 7 8 | .arrow{ display: inline-block; border-top: 10px solid black; /*border-right: 10px solid transparent;*/ border-bottom: 10px solid transparent; border-left: 10px solid transparent; /*想要哪边箭头,直接把另外三边的颜色改成透明:transparent.*/ } |
标签:
原文地址:http://www.cnblogs.com/daliangtou/p/5252524.html