css3.0相比css2.0多了些我们经常需要使用的标签属性,例如:圆角,个别圆角,不透明度,阴影特效等

1、圆角(即如何画圆)border-radius

a{width:20px;

height:20px;

background:red;

border-radius:20px;}

:其实就是定义一个矩形,将圆的 半径和矩形的宽定义为同一个值,即得出圆。

2、个别圆角(对矩形倒圆角)border-radius

个别圆角:指对矩形的四个角定义圆角,可一次性定义四个角

a{width:20px;

height:20px;

background:red;

border-radius:5px;}

或者定义单个方向上的圆角:

a{width:20px;

height:20px;

background:red;

border-top-left-radius:5px;  (定义矩形左上角圆角)

border-top-right-radius:5px; (定义矩形右上角圆角)

border-bottom-left-radius:5px; (定义矩形左下角圆角)

border-bottom-right-radius:5px; (定义矩形右上角圆角)

}

注意::定义个别圆角时候,顺序是先上下,在左右。

3、不透明度  opacity

一个简单的语句就能实现

a {background:red;

opacity:0.3;}

注:opacity 取值为0-1。  0表示完全透明,1表示完全不透明。

4、阴影特效 shadow

a {background:red;

border:1px solid blue;

shadow:3px 5px 4px red;}

shadow 后面的3个取值表示的意思:

3px  表示:阴影特效在X轴上的距离;

5px 表示:阴影特效在Y轴上的距离;

4px 表示:阴影特效的大小,该值取值越大,阴影范围越大,但是颜色越浅。

css3.0的更多相关文章

  1. win7中VS2010中安装CSS3.0问题解决方法

    win7中VS2010中安装CSS3.0问题解决方法   在安装Standards Update for VS2010 SP1后,VS2010中没有CSS3.0问题,以下是我的解决方法 1.首先去官网 ...

  2. CSS3.0盒模型display:box;的使用

    CSS3.0盒模型display:-webkit-box;的使用 box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂 ...

  3. css3.0新属性效果在ie下的解决方案(兼容性)

    css3.0增加的新属性,如投影.渐变.旋转.圆角等等!这些新标准属性在ie6.ie7.ie8浏览器版本里得不到很好的支持,相信ie以后的新版本也会支持这些新属性的.目前ie6.ie7.ie8浏览器不 ...

  4. 海盗船长小米首页小船来回摆动CSS3.0效果

    海盗船长小米首页小船来回摆动CSS3.0效果,偶然之间看到的,就写了一个. <!DOCTYPE html> <html lang="en"> <hea ...

  5. 用CSS3.0画圆

    CSS3.0中有一个border-radius属性,这个属性允许向 div 元素添加圆角边框,也就是div边角不再一直是直角,在CSS3.0中可以做成圆角了,所以我们可以用这个属性用div画一个圆,或 ...

  6. CSS3.0盒模型display:-webkit-box;的使用

    box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典   的一个布局应用就是布局的垂直等高.水平均分.按比例划分. 目前box-flex属性还没 ...

  7. web前端--知识点,笔记叠加(javascript,jquery,html5+css3.0,ajax)

    函数传参列表,获取方法arguments的使用 function arg(){ var str = '总共传了'+arguments.length+'个参数\n'; for(var i=0;i< ...

  8. CSS3.0动画之hover---Y轴----3D旋转

    div#div2{display: table; width: 100%; height: 100%; text-decoration: none; outline: none; -webkit-tr ...

  9. 让 VS2010 支持 HTML5 和 CSS3.0

    现在的热门话题之一是HTML5 和 CSS3.好的, 它们都很时髦,它们也必然会影响网络开发的未来. 让我们尝尝鲜,花点时间安装设置一下,尽快让Visual Studio2010支持HTML5 和 C ...

随机推荐

  1. des 加密 iOS

    转载请注明原文出处 生成同名的Des.h文件和Des.m文件后,拷贝下方的代码可直接使用.注意在Des.m文件中将key值修改为项目所需的key.--->  #define DesKey 过程很 ...

  2. Penalty

    Penalty时间限制:1000 ms | 内存限制:65535 KB难度:2描述As is known to us, the penalty is vitally important to comp ...

  3. codeforces 622C. Optimal Number Permutation 构造

    题目链接 假设始终可以找到一种状态使得值为0, 那么两个1之间需要隔n-2个数, 两个2之间需要隔n-3个数, 两个3之间隔n-4个数. 我们发现两个三可以放到两个1之间, 同理两个5放到两个3之间. ...

  4. codeforces 622E. Ants in Leaves

    题目链接 给一棵有根树, 每个叶子节点上有一只蚂蚁. 在0时刻蚂蚁开始向上爬, 同一时刻, 除了根节点以外, 一个节点上面不能有2个蚂蚁. 问所有的蚂蚁都爬到根节点需要的最短时间. 因为除了根节点, ...

  5. IOS 学习笔记(2) 视图UINavigationController

    1.栈 导航控制器自身有一个针对显示内容的栈,也有一个对于导航栏的栈,当有新的内容欲显示时,进的导航栏和显示内容会被压入此栈,这样原本显示中的导航栏和显示内容则会进入到栈的更深一层中,根据栈的先进后出 ...

  6. 帝国cms7.0判断字段为空,显示为不同

    在一些情况下,我们的字段会留空,但是又不希望内容模板上只显示空.比如,在后台,如添加作者为小明,则显示小明,不填作者则显示"佚名",我们可以用以下代码. <? if($nav ...

  7. (图文教程)帝国cms7.0列表页模板调用多说评论次数

    多说是站长朋友们常用的一款社会化评论插件.这里为大家介绍一下帝国列表页调用多说评论次数的方法. 文章由谢寒执笔.博客地址:www.cnblogs.com/officexie/: 1.首先在内容页模板中 ...

  8. RFID电子标签制造封装工艺和可靠性研究

    一.目的和意义 电子标签已经成为RFID工业的主要焦点 实现低成本.大批量.高可靠性地制造电子标签是推广RFID产品应用的关键技术之一 针对RFID标签制造中核心的封装工艺开展研究,以各向异性导 ...

  9. hdoj 3062 Party(2-SAT)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3062 思路分析:将问题转换为2-SAT问题,需要注意的是将命题转换为有向图的方法:命题中A1, A2, ...

  10. UITextField align left margin

    如果我们想让我们的UITextField输入的字体偏移几个像素,我们常常用空格来代替,有时候我们不想用空格的话怎么办? #import <UIKit/UIKit.h> @interface ...