JQuery - 圆角

时间:2011-09-05 09:40:04

标签: jquery curvycorners

我对我的网站的意图是添加弯曲的角落.. 有没有人知道是否有办法在页面上的每个元素的角落周围制作弯曲的角落...... 如果是这样的话,你是怎么做到的?

5 个答案:

答案 0 :(得分:3)

你不需要JavaScript,你可以用CSS做 - 虽然IE6不支持这个。对于所有浏览器,您将需要使用图像。

试试这个:

.round{
    -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
}

<div class="round etc etc"></div>

答案 1 :(得分:1)

正如@JLeagle已经指出的那样,你可以使用CSS在大多数浏览器中实现这一点。

如果您 需要支持旧浏览器,那么您可以使用一个漂亮的jQuery Curvy Corners plugin

http://plugins.jquery.com/project/curvy-corners

答案 2 :(得分:1)

最简单的选择:CSS3 Solution 如果您想支持旧浏览器(例如IE6),则必须使用图像。 不知道如何/为什么你会用jQuery做到这一点。

答案 3 :(得分:1)

<div id="#my-element">Content</div>

CSS:

#my-element{
  -moz-border-radius: 15px;
  -webkit-border-radius:15px;
  border-radius: 15px; /*Future proofing*/
}

OR:

jQuery的:

$('#my-element').css({
 -moz-border-radius: 15px, 
 -webkit-border-radius:15px,
  border-radius: 15px
});

答案 4 :(得分:1)

由于很多原因,没有通用的解决方案,因为你将拥有不同大小的元素,并且你希望它们的角半径适合它们的大小,但主要是因为你有交叉浏览器问题需要处理用。

所以我的观点是你的问题没有单一的答案,而且这里的答案太过模糊。