div的圆形边框怎么弄,还有的两个角方的,两个角圆的,要怎么设定CSS文件啊

 我来答
Tebro9
2015-09-12 · TA获得超过559个赞
知道小有建树答主
回答量:161
采纳率:100%
帮助的人:228万
展开全部

css代码:

.yj{

    padding:10px; width:300px; height:50px;

    border: 2px solid #000000;

    -moz-border-radius: 15px; 

    -webkit-border-radius: 15px; 

    border-radius:15px;           

}

 -moz-border-radius: 15px; -webkit-border-radius: 15px;  这两个是为了兼容其他一些不常用浏览写的css圆角代码

html代码:

<div class="yj">这个div四个角都圆15px;</div>

结果如下:

图片圆角也是一样的:

css代码:

.yj{-moz-border-radius: 15px;     -webkit-border-radius: 15px; border-radius:15px;}

html代码:

<img src="xp.jpg" width="100px" height="100px;" class="yj" />

结果如下:

css3圆角代码也支持上下左右的:

css代码这么写:

.yj{

    padding:10px; width:300px; height:50px;

    border: 2px solid #000000;

    -moz-border-radius: 0px 0px 20px 25px;;     

    -webkit-border-radius: 0px 0px 20px 25px;;  

    border-radius:0px 0px 20px 25px;; 

}

结果如下

圆角代码也支持拆分的(四个边框都圆角10px的拆分css代码如下):

border-top-left-radius: 10px;   

border-top-right-radius: 10px; 

 border-bottom-right-radius:10px;  

border-bottom-left-radius:  10px;

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式