css3.0
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的更多相关文章
- win7中VS2010中安装CSS3.0问题解决方法
win7中VS2010中安装CSS3.0问题解决方法 在安装Standards Update for VS2010 SP1后,VS2010中没有CSS3.0问题,以下是我的解决方法 1.首先去官网 ...
- CSS3.0盒模型display:box;的使用
CSS3.0盒模型display:-webkit-box;的使用 box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂 ...
- css3.0新属性效果在ie下的解决方案(兼容性)
css3.0增加的新属性,如投影.渐变.旋转.圆角等等!这些新标准属性在ie6.ie7.ie8浏览器版本里得不到很好的支持,相信ie以后的新版本也会支持这些新属性的.目前ie6.ie7.ie8浏览器不 ...
- 海盗船长小米首页小船来回摆动CSS3.0效果
海盗船长小米首页小船来回摆动CSS3.0效果,偶然之间看到的,就写了一个. <!DOCTYPE html> <html lang="en"> <hea ...
- 用CSS3.0画圆
CSS3.0中有一个border-radius属性,这个属性允许向 div 元素添加圆角边框,也就是div边角不再一直是直角,在CSS3.0中可以做成圆角了,所以我们可以用这个属性用div画一个圆,或 ...
- CSS3.0盒模型display:-webkit-box;的使用
box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典 的一个布局应用就是布局的垂直等高.水平均分.按比例划分. 目前box-flex属性还没 ...
- web前端--知识点,笔记叠加(javascript,jquery,html5+css3.0,ajax)
函数传参列表,获取方法arguments的使用 function arg(){ var str = '总共传了'+arguments.length+'个参数\n'; for(var i=0;i< ...
- CSS3.0动画之hover---Y轴----3D旋转
div#div2{display: table; width: 100%; height: 100%; text-decoration: none; outline: none; -webkit-tr ...
- 让 VS2010 支持 HTML5 和 CSS3.0
现在的热门话题之一是HTML5 和 CSS3.好的, 它们都很时髦,它们也必然会影响网络开发的未来. 让我们尝尝鲜,花点时间安装设置一下,尽快让Visual Studio2010支持HTML5 和 C ...
随机推荐
- Unity Editor下对资源进行操作时调用AssetModificationProcessor
public class Test : UnityEditor.AssetModificationProcessor { private static void OnWillCreateAsset(s ...
- C3p0实践
jar包 c3p0-0.9.2.1.jar mchange-commons-java-0.2.3.4.jar mysql-connector-java-5.1.28-bin.jar 建立数据库 CRE ...
- C++ const 限定符
C++ const 限定符 作用:把一个对象转换成一个常量 用法:const type name = value; 性质:1. 定义时必须初始化,定义后不能被修改.2. 类中的const成员变量必须通 ...
- BZOJ 1449: [JSOI2009]球队收益( 最小费用最大流)
先考虑假如全部输了的收益. 再考虑每场比赛球队赢了所得收益的增加量,用这个来建图.. --------------------------------------------------------- ...
- Java学习之equals和==的区别
转自:http://www.cnblogs.com/zhxhdean/archive/2011/03/25/1995431.html java中的数据类型,可分为两类: 1.基本数据类型 也称原始数 ...
- JS 利用window.open实现post方式的参数传递
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Delphi 常用属性说明(超长)
Delphi组件的常用事件Onclick——当单击时触发这个事件中的代码Onchange——当改变该组件内容时触发其中的代码Oncreate——当创建时触发这个事件中的代码Onclose——当关闭的时 ...
- 分布式配置管理平台 Disconf
Distributed Configuration Management Platform(分布式配置管理平台) 专注于各种 分布式系统配置管理 的通用组件/通用平台, 提供统一的配置管理服务. 包括 ...
- 表格java代码的相关知识积累
本文主要收集各大博客中的java表格 用JSP创建一个表格模板 . 项目中要用到一些展示信息的表格,表头不固定,表格内容是即时从后台取的:考虑到复用性,笔者用jsp编写了一个表格模板,可以从reque ...
- Hat’s Words(字典树)
Hat’s Words Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total ...