圆角属性:border-radius

<style type="text/css">
.content{
border: 1px solid green;
width: 200px;
height: 150px;
background-color: grey;
      /*为了兼容不同浏览器,通常这么写*/
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}
</style>

实现圆角按钮:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.btn{
width: 150px;
height: 50px;
font-size: 16px;
background-color: green;
border: 0px ;
border-radius: 5px;
}
</style>
</head>
<body>
<input type="button" class="btn" value="我是圆角按钮"/>
</body>
</html>

效果:

css3中的圆角属性的更多相关文章

  1. css3中的animation属性

    作用:通过给元素添加animation属性,可以赋予该元素动画效果. <!DOCTYPE html><html>    <head>        <styl ...

  2. CSS3中哪些新属性—阴影、文本省略(1)

    CSS3中的阴影,我知道的就是盒阴影和文字阴影.两者使用大同小异. 1.文字阴影 不知道为啥阴影会被开发出来,觉得这没啥好用啊.用了之后发现好像还行,使页面更有立体感了那么一点点.看起来趣味性强一点. ...

  3. css3中的scroll-behavior属性

    scroll-behavior属性 当用户手动导航或者 CSSOM scrolling API 触发滚动操作时,CSS 属性 scroll-behavior 为一个滚动框指定滚动行为,当用户通过鼠标滑 ...

  4. CSS3中的Transition属性详解

    w3c标准中对CSS3的transition这是样描述的:“CSS的transition允许CSS的属性值在一定的时间区间内平滑地过渡.这种效果可以在鼠标单击.获得焦点.被点击或对元素任何改变中触发, ...

  5. CSS3中的Transition属性详解(贝赛尔曲线)

    transition语法: transition : [<'transition-property'> || <'transition-duration'> || <'t ...

  6. CSS3中的一些属性

    1. 可匹配部分字符串 2. box-sizing属性 3. CSS3多栏布局 1.可匹配部分字符串 /*^运算符,匹配字符串首部*/ a[href^='http://website'] /*$运算符 ...

  7. css3中样式计算属性calc()的使用和总结

    calc的介绍 在css3样式中有一个类似与函数的计算属性calc(),它主要用于指定元素的长度,无论是border.margin.pading.font-size和width等属性都可以使用calc ...

  8. CSS3 中的 box-sizing属性

    语法: box-sizing: content-text | border-box | inherit; content-box(默认): 宽度和高度分别应用元素的内容框:在宽度和高度之外绘制元素的内 ...

  9. css3中的box-sizing属性的使用

    box-sizing属性用来定义元素的width和height所表示的区域,该属性一般有三种值:content-box.border-box.inherit. 其中inherit表示box-sizin ...

随机推荐

  1. Semaphore — Windows API

    Semaphore是旗语的意思,在Windows中,Semaphore对象用来控制对资源的并发访问数.Semaphore对象具有一个计数值,当值大于0时,Semaphore被置信号,当计数值等于0时, ...

  2. Docker 初级实践

    Docker 应用 优势 与虚拟相比Docker更加轻量高效,更加方便移植.虚拟机提供的是完整的操作系统环境,包含了大量类似硬件驱动.虚拟处理器.网络接口等等并不需要的信息,也需要比较长时间的启动,同 ...

  3. html表格合并(行,一排)

    <table> <tr> <td colspan="2">失败的例子:</td> </tr> {% for ip , j ...

  4. Embedded tomcat 7 servlet 3.0 annotations not working--转

    Question: I have a stripped down test project which contains a Servlet version 3.0, declared with an ...

  5. LA 6450 Social Advertising

    [题目] 给一个无向图,每当对某个点操作,该点以及与该点相连的点都获得标记,问标记所有点至少需要操作多少次 输入 第一行为T,表示测试数据组数 每组测试数据第一行为n(1<=n<=20)表 ...

  6. NYOJ 1091 超大01背包(折半枚举)

    这道题乍一看是普通的01背包,最最基础的,但是仔细一看数据,发现普通的根本没法做,仔细观察数组发现n比较小,利用这个特点将它划分为前半部分和后半部分这样就好了,当时在网上找题解,找不到,后来在挑战程序 ...

  7. python面对对象编程------4:类基本的特殊方法__str__,__repr__,__hash__,__new__,__bool__,6大比较方法

    一:string相关:__str__(),__repr__(),__format__() str方法更面向人类阅读,print()使用的就是str repr方法更面对python,目标是希望生成一个放 ...

  8. 执行CMD命令

    可以执行多条命令,用“\r\n”分割 using System; using System.Diagnostics; namespace Tool { public class CMDHelper { ...

  9. 注意在insert插入数据库时的int类型问题

    比如,一个语句,insert into mbProduct(p_UserID,p_BigID,p_qq)values("+getUserid+",'"+getdrpdl+ ...

  10. win8发布 wcf问题

    WCF services don’t run on IIS 8 with the default configuration, because the webserver doesn’t know, ...