1. 程式人生 > >web中利用邊框制作三角形

web中利用邊框制作三角形

otto order 技術 布局 utf-8 meta height ora charset

<!DOCTYPE html>
<html>
  <head>
  <meta charset="UTF-8">
    <title>邊框制作三角形</title>
    <style>
      div{
        width:0px;
        height:0px;//讓塊的高和寬為零,是下面邊框匯成一點
        
        border-bottom: 100px solid orange;
        border-left: 100px solid transparent; //把左邊的三角形顏色隱藏
        border-right:100px solid transparent;
        border-top:100px solid transparent;


      }
    </style>

  </head>
  <body>
    <div></div>//建立布局
  </body>

//實現效果如下


</html>技術分享

web中利用邊框制作三角形