美文网首页
css3-圆角

css3-圆角

作者: AssertDo | 来源:发表于2019-08-26 16:08 被阅读0次
 /*添加边框圆角*/
            /*1.设置一个值:四个角的圆角值都一样*/
            border-radius: 10px;
            /*2.设置两个值:第一个值控制左上/右下,第二个值控制右上/左下*/
            border-radius: 10px 30px;
            /*3.设置三个值:第一个值控制左上,第二值控制右上/左下,第三个值控制右下*/
            border-radius: 10px 40px 60px;
            /*4.设置四个值:左上  右上 右下 左下*/
            border-radius: 10px 30px 60px 100px;

            /*添加/是用来设置当前个不同方向的半径值  水平x方向/垂直y方向*/
            border-radius: 100px/50px;

            /*添加某个角点的圆角*/
            border-radius: 0px 50px 0px 0px;
            /*border-上下-左右-radius:*/
            border-top-right-radius: 100px;
            border-top-left-radius: 100px;
            border-bottom-left-radius: 100px;
            border-bottom-right-radius: 100px;

            /*设置某个角点的两个方向上的不同圆角*/
            border-top-right-radius: 100px 50px;
            border-bottom-left-radius: 80px 40px;
            border-bottom-right-radius: 60px 30px;
            border-top-left-radius: 40px 20px;
            /*如果想设置四个角点的不同方向上的不同圆角值*/
            /*分别是水平方向的:左上,右上,右下,左下 / 垂直方向的:左上,右上,右下,左下*/
            border-radius: 100px 0px 0px 0px/20px 0px 0px 0px;

相关文章

  • css3-圆角

  • css3-边框-阴影,圆角,渐变,透明

    圆角 border-radius:25px;25px为半径,最大不超过该模块长宽的一半 阴影 x代表水平位移,0+...

  • css3-变形

    .css3-变形 transform 是css的变形属性,通过变形函数,设置具体的变形方式 scale()变形函数...

  • Flutter 部分圆角

    top 圆角 bottom 圆角 左边 圆角 右边 圆角

  • Image

    直接圆角图片 设置圆角图片度数 设置圆角图片带灰色圆角边框 设置圆角图片带灰色圆角边框带阴影

  • iOS开发-性能篇(持续更新中...)

    高效圆角 注意避免使用maskToBounds UIView的圆角 UILabel的圆角

  • iOS 绘制圆角

    级别: ★☆☆☆☆标签:「iOS切圆角」「layer圆角」「CAShapeLayer圆角」作者: Xs·H审校: ...

  • 圆角和边框

    圆角 圆角代码实现: 圆角User Defined Runtime Attributes实现: layer.cor...

  • 圆角矩形

    圆角钜形 上半边圆角钜形 下半边圆角钜形

  • Android设置上圆角和下圆角

    Android设置上圆角和下圆角 圆角背景多用于卡片等布局 1.正常的圆角 代码如下: 2.上圆角 代码如下: 3...

网友评论

      本文标题:css3-圆角

      本文链接:https://www.haomeiwen.com/subject/hxkdectx.html