border-radius的含义是:圆角。border-radius是一种缩写方法。
如果“/”前后的值都存在,那么“/”前面的值设置其水平半径,“/”后面值设置其垂直半径。
设置圆角全部为5像素
border-radius: 5px 5px 3px 3px;
border-radius: [左上] [右上] [右下] [左下];
------------------------------------------------
border-radius:2em;
等价于:
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;
------------------------------------------------
border-radius: 2em 1em 4em / 0.5em 3em;
等价于:
border-top-left-radius: 2em 0.5em;
border-top-right-radius: 1em 3em;
border-bottom-right-radius: 4em 0.5em;
border-bottom-left-radius: 1em 3em;
注释:按此顺序设置每个 radii 的四个值。如果省略 bottom-left,则与 top-right 相同。
如果省略 bottom-right,则与 top-left 相同。如果省略 top-right,则与 top-left 相同。
CSS3 border-radius 属性
最新推荐文章于 2022-03-25 11:36:29 发布