其实是对(理论上是对所有的)html元素: 而实际 常用的是 div块, 链接a 等运用圆角矩形的样式
这个圆角是通过元素: div, a的 css 样式来实现的:
样式: border-radius/ border-top-left-radius左上/..../可以分别设置不同的, 也可以是一样的
radius是半径, 如果radius等于div 边长的一半, 就是圆
一般: 先设置整体的border,然后再设置border-radius:
border: 1px solid #ccc(这个是经典的边框灰)
border-radius: 5-10px;
在css3-matic上,还对 ff和chrome做了特别说明:
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px; //ff和chrome, 在样式名称前面分别加上: -moz-(内核是Gecko), -webkit-
-webkit-border-radius: 5px 5px 5px 5px;
border: 0px solid #000000;
而只有右边的"分隔线",是通过div的 border样式来实现的, 只写 右边的border样式就可以了: border-right: 1px solid #ccc
border-radius是css3 中的样式属性!
现代浏览器ff,chrome和ie9+以上版本的都支持 border-radius:
在 CSS2 中添加圆角矩形需要技巧。我们必须为每个圆角使用不同的图片。
在 CSS3 中,创建圆角是非常容易的。
在 CSS3 中,border-radius 属性用于创建圆角:
div
{
border:2px solid;
border-radius:25px;
-moz-border-radius:25px; /* Old Firefox */
}
-moz代表firefox浏览器私有属性
-ms代表IE浏览器私有属性
-webkit代表chrome、safari私有属性
-o-表示opera
这些都是css3里面的
以-webkit开头的Webkit浏览器特有扩展样式
与以-moz开头的Firefox特有扩展样式相同,以-webkit开头的样式是 Webkit浏览器特有的,只有Webkit浏览器可以解析。
比如,在Webkit浏览器中可以用 -webkit-border-radius实现圆角。
CODESOFT中的圆角矩形的弧度该怎样设置?
CODESOFT标签设计软件提供多种图形制作按钮,方便用户更为快捷的制作标签.其中就包括矩形,圆角矩形的快捷创建按钮.本文将介绍如何设置CODESOFT圆角矩形的弧度. 若有疑问可直接访问:htt ...
[Web 前端] 如何在React中做Ajax 请求?
cp from : https://segmentfault.com/a/1190000007564792 如何在React中做Ajax 请求? 首先:React本身没有独有的获取数据的方式.实际上, ...
在Microsoft Expression Blend 2 中绘制圆角矩形按钮
原文:在Microsoft Expression Blend 2 中绘制圆角矩形按钮 /* 声明:转载请保留此信息:http://www.BrawDraw.com, http://www.ZPXP.c ...
[BOT] 一种android中实现“圆角矩形”的方法
内容简介 文章介绍ImageView(方法也可以应用到其它View)圆角矩形(包括圆形)的一种实现方式,四个角可以分别指定为圆角.思路是利用"Xfermode + Path"来进行 ...
Android中实现圆角矩形及半透明效果。