css-利用邊框畫三角形
阿新 • • 發佈：2018-02-28
OS lsp css ble light htm lpad log x11
html中代碼
| 1 2 3 4 |
<div class=‘box-rihgt‘></div>
<div class=‘box-top‘></div>
<div class=‘box-left‘></div>
<div class=‘box-bottom‘></div>
|
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
.box-top{
width: 0;
height: 0;
border-right:10px solid transparent;
border-left:10px solid transparent;
border-bottom: 20px solid #333;
}
.box-bottom{
width: 0;
height: 0;
border-right:10px solid transparent;
border-left:10px solid transparent;
border-top: 20px solid #999;
}
.box-left{
width: 0;
height: 0;
border-bottom:10px solid transparent;
border-top:10px solid transparent;
border-right: 20px solid green;
}
.box-rihgt{
width: 0;
height: 0;
border-bottom:10px solid transparent;
border-top:10px solid transparent;
border-left: 20px solidred;
}
|
css-利用邊框畫三角形