border-radius 设置div为圆形 圆角

 

(1)设置宽高  ,如下图效果

 

 

 

 

 

 (2)圆形 :宽高设一致 , 设置border-radius :50% ,

   圆角:宽高不一致 ,设置border-radius : div 高度值

1 <div id="radius"></div>
2 <div id="yuanjiao"></div>
 1     #radius {
 2                 width: 50px;
 3                 height: 50px;
 4                 background-color: brown;
 5                 margin-bottom: 20px;
 6                 border-radius: 50%;     //设置圆形
 7             }
 8             #yuanjiao{
 9                     width: 100px;
10                     height: 50px;
11                     border-radius:50px;     //设置圆角
12                     background-color: darkgoldenrod;
13             }

 

 

 

posted @ 2020-11-13 11:26  樱樱  阅读(2251)  评论(0)    收藏  举报