圆角属性：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. DLL入门浅析(5)——使用DLL在进程间共享数据

    转载自:http://www.cppblog.com/suiaiguo/archive/2009/07/21/90734.html 在Win16环境中,DLL的全局数据对每个载入它的进程来说都是相同的 ...

  2. centos 64bit 安装与升级 chrome的方法

    vim /etc/yum.repos.d/CentOS-Base.repo 根据你的系统增加一个节点 [google64] name=Google - x86_64 baseurl=http://dl ...

  3. uploadify在struts2下的使用

    1.首先准备uploadify上传插件包,拷贝到项目目录下 2.注意其中的特殊文件:uploadify-init.js文件,是包含了封装后的特殊函数: /** * uploadify上传插件相关JS ...

  4. jQuery on()绑定动态元素出现的问题小结

    jQuery on()方法是官方推荐的绑定事件的一个方法.使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件,通过本文给大家介绍jQuery on()绑定动态元素出现的问题小结,需要的朋友 ...

  5. uboot启动后在内存中运行裸机程序hello

    如题,实现过程中发现3额问题,先写下来,待解答: 1.uboot启动后再dnw上打印许多信息,我想改变其中的打印信息或加上自己的打印信息以证明程序运行到何处.修改完后重新编译uboot.bin. 在D ...

  6. 建立企业内部mavenserver并使用Android Studio公布公共项目

    由于Android Studio使用了Gradle构建工具,在library依赖的处理上是将被依赖的library作为一个module引入(拥有一份完整的library拷贝),而Eclipse的ADT ...

  7. Xcode HeaderDoc 教程（2）

    Code Snippets,让一切变得更简单: 这真的非常easy,不是吗?但还能更简单一些吗? 本站以前介绍过 code snippets.请看这里. Code snippets 在 Xcode 中 ...

  8. Android学习_ContentProvider和Uri

    ContentProvider概述 public abstract class ContentProvider extends Object implements ComponentCallbacks ...

  9. unity3d Find()使用

    1. Hierarchy 创建对象如两个cube时,未修改名称,名称都为cube时. js添加至Camera: private var cubeObj : GameObject; //private ...

  10. A+B问题（java）

    import java.util.Scanner; public class Main { public static void main ( String args[] ) { Scanner in ...