首页 > web前端 > css教程 > 正文

使用css3制作圆角实例代码

零下一度
发布: 2017-04-26 17:34:45
原创
1482 人浏览过

现在使用css3的制作圆角越来越多了,下面小编就来分享一个

/* set millions of background images */
.rbroundbox { background: url(nt.gif) repeat; }
.rbtop p { background: url(tl.gif) no-repeat top left; }
.rbtop { background: url(tr.gif) no-repeat top right; }
.rbbot p { background: url(bl.gif) no-repeat bottom left; }
.rbbot { background: url(br.gif) no-repeat bottom right; }
/* height and width stuff, width not really nessisary. */
.rbtop p, .rbtop, .rbbot p, .rbbot {
width: 100%;
height: 7px;
font-size: 1px;
}
.rbcontent { margin: 0 7px; }
.rbroundbox { width: 50%; margin: 1em auto; }
登录后复制

2. [代码]

<p class="rbroundbox">
<p class="rbtop"><p></p></p>
<p class="rbcontent">
<p>Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Duis
ornare ultricies libero. Donec
fringilla, eros at dapibus fermentum,
tellus tellus auctor erat, vitae porta
magna libero sed libero. Mauris sed leo.
Aliquam aliquam. Maecenas vestibulum.</p>
</p><!-- /rbcontent -->
<p class="rbbot"><p></p></p>
</p><!-- /rbroundbox -->
登录后复制

以上是使用css3制作圆角实例代码的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板