<!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8"/>

         <style>

             div {

                 height: 35px;

                 line-height: 35px;

                 border: 2px solid #a1a1a1;

                 background: #dddddd;

                 width: 350px;

             }

             .div1 {

                 border-radius: 35px;

                 -moz-border-radius: 35px;

                 /* 老的 Firefox */

             }

             .div2 {

                 border-radius: 35px/5px;

                 -moz-border-radius: 35px;

                 /* 老的 Firefox */

             }

         </style>

     </head>

     <body>

         <div class="div1">border-radius 属性允许您向元素添加圆角。</div>

         <div>border-radius 属性允许您向元素添加圆角。</div>

         <div class="div2">border-radius 属性允许您向元素添加圆角。</div>

     </body>

 </html>

浏览器结果显示如下：

半径35px，div高度35px；直径小于div高度时，直径按照div高度计算

css3属性——border-radius用法的更多相关文章

  1. css3属性box-sizing:border-box 用法解析

    响应式Web设计经常需要我们通过百分比设置组件宽度.如果我们不考虑边框,那么很容易就可以实现,但如果你给每一列以及总宽度都采用百分比设置,那这个时候固定的边框大小就会出来捣乱.下面我们将看到一组方法去 ...

  2. CSS3动画属性animation的用法

    转载: 赞生博客 高端订制web开发工作组 » CSS3动画属性animation的用法 CSS3提供了一个令人心动的动画属性:animation,尽管利用animation做出来的动画没有flash ...

  3. css3属性中background-clip与background-origin的用法释疑

    困惑在哪里? background-clip 与 background-origin是css3中引入的两个跟元素背景相关的属性,它们有相同的可选值,即border.padding.content 三种 ...

  4. [css]需警惕CSS3属性的书写顺序

    转载张鑫旭:http://www.zhangxinxu.com/wordpress/2010/09/%E9%9C%80%E8%AD%A6%E6%83%95css3%E5%B1%9E%E6%80%A7% ...

  5. 如何处理CSS3属性前缀（转载）总结

    今天闲来无聊,重新来说说CSS3前缀的问题.在春节前和@一丝姐姐说起Sass中有关于gradient的mixins.姐姐说: 为什么还要用mixin呢?为什么不使用Autoprefixer?使用Aut ...

  6. IT兄弟连 HTML5教程 CSS3揭秘 CSS3属性1

    通过CSS选择器找到元素,就要使用CSS属性给找到的元素设置样式.尽管现在的浏览器已经支持了众多的CSS3属性,但作为初学者,最应该关注的就是一些“主流”的属性,如border-radius.box- ...

  7. 前端CSS3布局display:grid用法

    前端CSS3布局display:flex用法 1. 先附上代码 点击查看代码 <!DOCTYPE html> <html> <head> <meta char ...

  8. 前端CSS3布局display:flex用法

    前端CSS3布局display:flex用法 先附上代码 点击查看代码 <!DOCTYPE html> <html> <head> <meta charset ...

  9. CSS3属性transform详解之（旋转:rotate,缩放:scale,倾斜:skew,移动:translate）

    CSS3属性transform详解之(旋转:rotate,缩放:scale,倾斜:skew,移动:translate)   在CSS3中,可以利用transform功能来实现文字或图像的旋转.缩放.倾 ...

  10. CSS3属性border-radius绘制多种多样的图形

    border-radius,国内翻译成圆角,你可能以为这个属性就是用来画圆角,没错,但是除此之外,它还可以做点别的事情.radius其实指的是边框所在圆的半径,这个CSS3属性不仅能够创建圆角,还可以 ...

随机推荐

  1. ASP.NET MVC 中的 T4

    每次使用“添加视图”或“添加控制器”功能时,您都在 ASP.NET MVC 项目中使用 T4 模板.这些模板位于 Common7\IDE\ItemTemplates\CSharp\Web\MVC 2\ ...

  2. 高性能javascript 学习笔记（1）

    加载和运行 管理浏览器中的javascript代码是个棘手的问题,因为代码运行阻塞了其他浏览器处理过程,诸如用户绘制,每次遇到<script>标签,页面必须停下来等待代码下载(如果是外部的 ...

  3. Docker背后的容器管理——Libcontainer深度解析

    Libcontainer 是Docker中用于容器管理的包,它基于Go语言实现,通过管理namespaces.cgroups.capabilities以及文件系统来进行容器控制.你可以使用Libcon ...

  4. MVC-04 视图（1）

    不可否认的,View应该是整个ASP.NET MVC项目开发过程中最花时间的部分,因为与显示逻辑相关的技术五花八门,你可能要学习的有HTML.CSS.JavaScript.DOM.JQuery.JSO ...

  5. oracle10g安装图解(win7)

    一.Oracle10g 安装预备步骤取得 Oracle 10g 安装程序,或从 Oracle 技术网(OTN)下载光盘映像.在评估阶段您可以免费下载和使用无技术限制的全功能 Oracle,但在正式的商 ...

  6. web.xml中servlet, bean, filter, listenr 加载顺序汇总

    最终得出结果:先 listener >> filter >> servlet >> spring 所以,如果过滤器中要使用到 bean,可以将spring 的加载 ...

  7. Python生成随机数的方法

    这篇文章主要介绍了Python生成随机数的方法,有需要的朋友可以参考一下 如果你对在Python生成随机数与random模块中最常用的几个函数的关系与不懂之处,下面的文章就是对Python生成随机数与 ...

  8. pomelo

    简介 Pomelo 是基于 Node.js 的高性能.分布式游戏服务器框架.它包括基础的开发框架和相关的扩展组件(库和工具包),可以帮助你省去游戏开发枯燥中的重复劳动和底层逻辑的开发.Pomelo 不 ...

  9. 网页压缩gzip的问题及说明教程

    关于网页压缩gzip的问题及说明教程 最近比较多人反应gzip的问题 在wdcp的后台里已经有gzip功能的选项,也就是说,只要在这里开启了,就已支持 但从最近的问题中发现,基本上都是使用一些在线检测 ...

  10. poj2125Destroying The Graph(最小割+输出方案)

    题目请戳这里 题目大意:给一张有向图,现在要选择一些点,删掉图中的所有边.具体操作为:选择点i,可以选择删除从i出发的所有有向边或者进入i的所有有向边,分别有个代价ini和outi,求最小的代价删掉所 ...