计算内部元素的圆角边框大小以匹配外部元素

时间:2011-08-16 07:36:38

标签: jquery css rounded-corners css3

正如您在此示例中所看到的,两个具有相同圆角边框像素值的嵌套元素不匹配:

http://jsfiddle.net/bMFaH/

现在,根据宽度/高度/边框厚度/ ......内部边界半径应该是什么,我可以运行某种javascript来“计算”吗?

原因是我需要这个用于很多不同的(用户设置)边界半径和元素大小,所以我不能只输入静态值。

编辑:确定做了一些进一步的测试,这是正确的:

Outer radius: x pixels
Outer border: y pixels
Inner radius: x-y pixels

提前致谢, 韦斯利

1 个答案:

答案 0 :(得分:0)

假设您知道如何获取和设置css值,获取外边界半径的“公式”是

inner.border-radius + outer.border-width

似乎很简单地让javascript脚本进行数学运算。

编辑: 或者,正如您所提到的,您可以使用outer.border-radius - outer.border-width计算内边界半径。