css怎么设置圆弧外框-开发网

css设定圆弧外框的办法是应用圆弧外框【border-radius】完成，那这四个弧度圆弧同样，能够写出【border-radius：30px；】。

css怎么设置圆弧外框

本实例教程作业环境：windows7系统软件、css3版，DELL G3计算机。

css设定圆弧外框的办法：

圆弧外框（border-radius）的最基本使用方法：

圆弧外框的最重要使用方法便是设定四个同样弧度圆弧

boder-top-left-radius：30px；      //左上方
boder-top-right-radius：30px；   //右上方
boder-bottom-left-radius：30px；  //右下方
boder-bottom-right-radius：30px； //左下方

那这四个弧度圆弧同样，能够写出：

border-radius：30px；

css设定圆弧外框：

css一部分：

.div1{
            margin:0 auto;
            background: darkcyan;
            width:200px;
            height:200px;
            border:2px solid darkslategray;
            border-radius:30px;
            text-align: center;
            line-height: 200px;
        }

html一部分：