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 ...
随机推荐
- window.parent与window.opener的区别与使用
window.parent 是iframe页面调用父页面对象 举例: a.html 如果我们需要在b.html中要对a.html中的username文本框赋值(就如很多上传功能,上传功能页在ifrma ...
- BZOJ 2440: [中山市选2011]完全平方数( 二分答案 + 容斥原理 + 莫比乌斯函数 )
先二分答案m,<=m的有m-∑(m/pi*pi)+∑(m/pi*pi*pj*pj)-……个符合题意的(容斥原理), 容斥系数就是莫比乌斯函数μ(预处理)... ----------------- ...
- BZOJ 3224: Tyvj 1728 普通平衡树(BST)
treap,算是模板题了...我中间还一次交错题... -------------------------------------------------------------------- #in ...
- golang并发编程
golang并发编程 引子 golang提供了goroutine快速实现并发编程,在实际环境中,如果goroutine中的代码要消耗大量资源时(CPU.内存.带宽等),我们就需要对程序限速,以防止go ...
- 帝国cms本地搬家到服务器文章路径问题?
由于我的服务器不支持采集功能,我只能选择先在本地采集好文章发布于本地,再打算同步于服务器. 按照官方的做法, 1.先进后台备份了网站的所有数据,系统——备份与恢复数据——备份数据 2.将e\admin ...
- 基于Visual C++2013拆解世界五百强面试题--题14-循环删除
有一个数组a[1000]存放0-1000,要求每隔二个数删除一个数,到末尾时循环到开头继续进行,求最后一个被删掉数的原始下标. 看到题目可以用循环链表保存这些数,然后循环删除,大大减少了一些复杂的边界 ...
- Spring 拦截器实现事物
Spring+Hibernate的实质:就是把Hibernate用到的数据源Datasource,Hibernate的SessionFactory实例,事务管理器HibernateTransactio ...
- 【LeetCode】Path Sum 2 --java 二叉数 深度遍历,保存路径
在Path SUm 1中(http://www.cnblogs.com/hitkb/p/4242822.html) 我们采用栈的形式保存路径,每当找到符合的叶子节点,就将栈内元素输出.注意存在多条路径 ...
- robomongo
Robomongo 是一个可视化的mongodb数据库工具,提供对mongodb的操作,javascript执行及语法高亮提示. 安装教程
- java实现字符串匹配问题之求两个字符串的最大公共子串
转载请注明出处:http://blog.csdn.net/xiaojimanman/article/details/38924981 近期在项目工作中有一个关于文本对照的需求,经过这段时间的学习,总结 ...