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;

}

结果