html怎么做圆⾓边框,border-radius以外的CSS圆⾓边框制作⽅
法
CSS3的border-radius利⽤DIV+CSS⽣成圆⾓边框，在很多情况下都会⽤到，⽬前DIV+CSS的圆⾓边框，⼀种是利⽤CSS3，⼀种是利⽤布局模拟出圆⾓。
先说第⼀种，利⽤CSS3，前提是您的浏览器必须⽀持CSS3，Firefox3是⽀持的，我看到的很多⽹站圆⾓也是利⽤CSS3直接⽣成的，⽆⾮就是ie下依然显⽰直⾓⽽已，让ie固执去吧。
利⽤CSS3，你可以指定4个⾓都是圆⾓，或者某⼀个⾓是圆⾓⾮常⽅便，代码如下：
CSS Code复制内容到剪贴板
#round{
background-color:#000;
border:1pxsolid#000;
-moz-border-radius:10px;
-webkit-border-radius:10px;
color:#fff;
}
#indie{
background-color:#000;
border:1pxsolid#000;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-top-left-radius:10px;
-webkit-border-bottom-left-radius:10px;
color:#fff;
}
圆⾓边框
部分圆⾓
不使⽤ border-radius 实现圆⾓CSS3中，利⽤属性 border-radius 可以很⽅便的设置出圆⾓矩形，但是在IE8及以下版本却不⽀持这个属性，为了在旧版本的浏览器中实现宽⾼⾃适应的圆⾓矩形，可以采⽤以下三种⽅法。
border radius什么意思1.使⽤背景图⽚制作圆⾓
使⽤背景图⽚制作宽、⾼⾃适应的圆⾓矩形，⾸先需要切出4个圆⾓图⽚，然后把4个圆⾓图⽚放在矩形的四个⾓上就⼤功告成了，这⼀共需要5个div标签，1个容器div和4个圆⾓背景div。是不是很好理解。
具体实现来说，需要注意⼀些细节。对于矩形容器div：
上下内边距的⼤⼩⾄少设置为圆⾓的⾼度。
position设置为相对定位。
放置内容。
对于4个圆⾓背景div：
分别设置各个圆⾓背景图⽚。
绝对定位于容器矩形的四个⾓。
需要设置宽⾼值才能显⽰背景图⽚。
假设圆⾓图⽚的宽⾼是5px，具体代码如下：XML/HTML Code复制内容到剪贴板

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。