画三角形和画半圆

一.画三角形

    <style type="text/css">
          div{
            width: 0;
                    border-color:transparent transparent rgb(0,0,0) transparent;
            border-width:10px 100px 150px 100px;
            border-style: solid;
        }
    </style>
    <div></div>   
上述可以画出向上的三角形,其中左右两边的边框宽度控制三角形底边长度,底边的边框宽度控制三角形的高度。

二.画半圆形

div {
   width:100px;
   height:50px;
   border-radius:50px 50px 0 0;
   background:red;
  }
<div></div>
上述可以画出上半部分的圆。

 

posted on 2017-04-05 15:02  周裕涛  阅读(294)  评论(0编辑  收藏  举报

导航