border

您所在的位置:网站首页 css按钮样式代码 border

border

2023-11-04 03:13| 来源: 网络整理| 查看: 265

该属性是一个 简写属性,是为了将这四个属性 border-top-left-radius、border-top-right-radius、border-bottom-right-radius (en-US),和 border-bottom-left-radius 简写为一个属性。

即使元素没有边框,圆角也可以用到 background 上面,具体效果受 background-clip 影响。

当 border-collapse 的值为 collapse 时,border-radius 属性不会被应用到表格元素上。

radius 可以是 或者 ,表示边框四角的圆角半径。只在单值语法中使用。 top-left-and-bottom-right 可以是 或者 ,表示边框左上角和右下角的圆角半径。只在双值语法中使用。 top-right-and-bottom-left 可以是 或者 ,表示边框右上角和左下角的圆角半径。只在双值或三值语法中使用。 top-left 可以是 或者 ,表示边框左上角的圆角半径。只在三值或四值语法中使用。 top-right 可以是 或者 ,表示边框右上角的圆角半径。只在四值语法中使用。 bottom-right 可以是 或者 ,表示边框右下角的圆角半径。只在三值或四值语法中使用。 bottom-left 可以是 或者 ,表示边框左下角的圆角半径。只在四值语法中使用。 inherit 表示四个值都从父元素计算值继承。

定义圆形半径或椭圆的半长轴,半短轴。负值无效。

使用百分数定义圆形半径或椭圆的半长轴,半短轴。水平半轴相对于盒模型的宽度;垂直半轴相对于盒模型的高度。负值无效。

例如:

css

border-radius: 1em/5em; /* 等价于: */ border-top-left-radius: 1em 5em; border-top-right-radius: 1em 5em; border-bottom-right-radius: 1em 5em; border-bottom-left-radius: 1em 5em;

css

border-radius: 4px 3px 6px / 2px 4px; /* 等价于: */ border-top-left-radius: 4px 2px; border-top-right-radius: 3px 4px; border-bottom-right-radius: 6px 2px; border-bottom-left-radius: 3px 4px;


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3