CSS圆角矩形设置
在网上找到了代码： <html><head><metahttp-equiv="Content-Type"content="text...
在网上找到了代码： <html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>CSS3实现圆角</title><style type="text/css">.box{width:200px;height:200px;background:#09F;-moz-border-radius:30px;-webkit-border-radius:30px;border-radius: 30px;}}</style></head><body><div class="box"></div></body></html> 可以达到圆角的效果。 但我就不明白了 咋个要设置三个属性额，每个值都要是我们要设定的度数？ -moz-border-radius:30px;-webkit-border-radius:30px;border-radius: 30px; 这三个属性都是用来干嘛的？？？
展开
展开全部
CSS圆角矩形可以使用 Border-radius 属性即可实现。
Border-radius 属性相关定义功能及其案例：
对浏览器的支持：IE9+、Firefox 4+、Chrome、Safari 5+ 以及 Opera 支持 border-radius 属性。
定义和用法：border-radius 属性是一个简写属性，用于设置四个 border-*-radius 属性。该属性允许您为元素添加圆角边框！
默认值：0；
继承性：no；
版本：CSS3；
JavaScript 语法：object.style.borderRadius="5px"。
语法：border-radius: 1-4 length|% / 1-4 length|%。
length：定义圆角的形状。
%：以百分比定义圆角的形状。
案例：
案例1：border-radius:2em;
等同于：
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;
案例2：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 相同。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
border-radius属性只有最新的浏览器才支持。
引入一些、前缀属性，以避免开发者因为网页属性选择而影响浏览器功能的发挥。
-moz-，火狐特有css扩展样式列表
webkit- 针对google chrome、apple safari
引入一些、前缀属性，以避免开发者因为网页属性选择而影响浏览器功能的发挥。
-moz-，火狐特有css扩展样式列表
webkit- 针对google chrome、apple safari
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这个兼容性不行啊.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
两个问题需要注意：
一，border-radius本身是为现代浏览器设计的，但是因为目前css3还没有成为实际上的标准，所以这个严格意义来说是标准的border-radius写法，并不能被所有的现代浏览器支持。而各大浏览器，在border-radius还没有成为w3c官方标准的时候，自己心里都拿不准未来的正式标准怎么写，所以使用了自己的专属标记，因此也就有了-moz之类的专用标签。
-moz-是firefox自定义的；
-webkit是webkit核心浏览器自定义的，使用这个核心的浏览器是chrome和苹果；
建议的写法是不要乱了顺序，border-raidus要放到最后，-moz和-webkit放在前面；
二，实际上，你还应该注意到：
对border-radius来说，它是对矩形的四个角全部定义的。假如你想只让左上角圆角，而其它三个角仍是直角的话，对不同的浏览器来说，都有特定的专有写法。
一，border-radius本身是为现代浏览器设计的，但是因为目前css3还没有成为实际上的标准，所以这个严格意义来说是标准的border-radius写法，并不能被所有的现代浏览器支持。而各大浏览器，在border-radius还没有成为w3c官方标准的时候，自己心里都拿不准未来的正式标准怎么写，所以使用了自己的专属标记，因此也就有了-moz之类的专用标签。
-moz-是firefox自定义的；
-webkit是webkit核心浏览器自定义的，使用这个核心的浏览器是chrome和苹果；
建议的写法是不要乱了顺序，border-raidus要放到最后，-moz和-webkit放在前面；
二，实际上，你还应该注意到：
对border-radius来说，它是对矩形的四个角全部定义的。假如你想只让左上角圆角，而其它三个角仍是直角的话，对不同的浏览器来说，都有特定的专有写法。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
