当前位置: 代码迷 >> 综合 >> css样式之border-radius
  详细解决方案

css样式之border-radius

热度:18   发布时间:2024-01-20 08:03:20.0

border-radius 属性设置边框的园角

    可能的值:像素,百分比

扩展延伸

html代码

<div></div>

css代码

 div { height: 200px; width: 200px; border: 2px solid #a72525; border-radius: 10px; } 

结果

css代码

 div { height: 200px; width: 200px; background: #a72525; border-radius: 50%; } 

结果

css代码

 div { height: 200px; width: 100px; border: 2px dashed #a72525; border-radius: 100px 0 0 100px; } 

结果

css代码

 div { height: 200px; width: 200px; border: 2px dotted #a72525; border-radius: 100% 0 0; } 

结果

css代码

 div { height: 200px; width: 100px; background: #f09; border-radius: 50%; } 

结果

css代码

 div { height: 200px; width: 200px; background: #f90; border-radius: 100% 0; } 

结果

css代码

 div { width: 0; height: 0; border: 100px solid gray; border-radius: 100px; border-right-color: transparent; } 

结果

  相关解决方案