Atitti css3 新特性attilax总结

图片发光效果2

透明渐变效果2

文字描边2

背景拉伸2

CSS3 选择器(Selector)4

@Font-face 特性7

Word-wrap & Text-overflow 样式9

Word-wrap9

Text-overflow10

文字渲染(Text-decoration) 描边12

CSS3 的多列布局(multi-column layout)13

边框和颜色(color, border)14

CSS3 的渐变效果(Gradient)15

线性渐变15

径向渐变16

CSS3 的阴影(Shadow)和反射(Reflect)效果19

CSS3 的背景效果21

CSS3 的盒子模型23

CSS3 的 Transitions, Transforms 和 Animation30

Transitions30

Transform31

Animation33

图片发光效果

text-shadow:#000 3px 0 0,#000 0 3px 0,#000 -3px 0 0,#000 0 -3px 0;

可以设置每个边的发光效果,繁琐些。。

透明渐变效果

background: radial-gradient(circle, rgba(230,251,12,1.00) 40%  , rgba(230,251,12,1.00) , rgba(230,251,12,0))  ; /* 标准的语法 */

文字描边

与该使用文字渲染(Text-decoration) 描边来做。。发光效果虽然也可,单效果不佳

背景拉伸

background-size:100% 100%;

CSS3 的 Transitions, Transforms 和 Animation30

Transitions30

transition-property:用于指定过渡效果

Transform31

Animation33

们来说说 Animation 吧。它可以说开辟了 CSS 的新纪元,让 CSS 脱离了“静止”这一约定俗成的前提。以 web

深入了解 CSS3 新特性.html

作者:: 绰号:老哇的爪子 ( 全名::Attilax Akbar Al Rapanui 阿提拉克斯 阿克巴 阿尔 拉帕努伊 )

汉字名:艾提拉(艾龙),   EMAIL:1466519819@qq.com

转载请注明来源: http://www.cnblogs.com/attilax/

Atiend

Atitti css3 新特性attilax总结的更多相关文章

  1. 新特性AAtitti css3 新特性attilax总结titti css

    Atitti css3 新特性attilax总结 图片发光效果2 透明渐变效果2 文字描边2 背景拉伸2 CSS3 选择器(Selector)4 @Font-face 特性7 Word-wrap &a ...

  2. Atitti html5 h5 新特性attilax总结

    Atitti html5 h5 新特性attilax总结 Attilax觉得不错的新特性 3.语义Header和Footer (The Semantic Header and Footer) 8.占位 ...

  3. Atitit opencv版本新特性attilax总结

    Atitit opencv版本新特性attilax总结 1.1. :OpenCV 3.0 发布,史上功能最全,速度最快的版1 1.2. 应用领域2 1.3. OPENCV2.4.3改进 2.4.2就有 ...

  4. Atitit mac os 版本 新特性 attilax大总结

    Atitit mac os 版本 新特性 attilax大总结 1. Macos概述1 2. 早期2 2.1. Macintosh OS (系统 1.0)  1984年2 2.2. Mac OS 7. ...

  5. CSS3新特性(阴影、动画、渐变、变形、伪元素等)

    CSS3与页面布局学习总结(六)--CSS3新特性(阴影.动画.渐变.变形.伪元素等)   目录 一.阴影 1.1.文字阴影 1.2.盒子阴影 二.背景 2.1.背景图像尺寸 2.2.背景图像显示的原 ...

  6. Atitit.jquery 版本号新特性attilax总结

    Atitit.jquery 版本号新特性attilax总结 1. Jq1.4 1 2. 1.5 1 3. 1.6 3 4. Jq1.7 3 ⒉提升了事件委派时的性能有了大幅度的提升.尤其是在ie7下: ...

  7. 深入了解css3新特性

    深入了解css3新特性:http://www.ibm.com/developerworks/cn/web/1202_zhouxiang_css3/

  8. H5 和 CSS3 新特性

    博客地址:https://ainyi.com/52 H5 新特性 语义化标签:header.footer.section.nav.aside.article 增强型表单:input 的多个 type ...

  9. css3新特性总结

    一.什么是css3 css用于控制网页的样式和布局,css3是css的升级版本,受浏览器限制,跨浏览器开发有点复杂.css3完全向后兼容 二.css3新特性 1.边框 css3的边框有如下属性: (1 ...

随机推荐

  1. kali linux 、 windows、ubuntu三系统的引导问题

    '小飞机'是一个学生,所以接触的东西,虽广泛,但并不精通,在此利用随笔,记录自己的一些学习过程,以及自己的想法,既可以有时间自己复习,也可以顺便帮助别人. 近期由于同学的引诱以及男生天生对于破解的好奇 ...

  2. 透明activity来实现悬浮蔗罩

    第一步, activity的代码, 关键代码是进出动画采用淡入淡出方式,让蔗罩出现消失更自然,全屏 public class RobotGuidceV2Activity extends RoboAct ...

  3. oracle官方文档的阅读方法

    Concept 包含了 oracle 数据库里面的一些基本概念和原理, 比如 数据库逻辑结构, 物理结构, 实例结构, 优化器, 事务等. PDF 460页 Reference 包含了动态性能视图, ...

  4. linux下的5个查找命令

    在Linux中,有很多方法可以做到这一点.国外网站LinuxHaxor总结了五条命令,你可以看看自己知道几条.大多数程序员,可能经常使用其中的2到3条,对这5条命令都很熟悉的人应该是不多的. 1. f ...

  5. 用js写的比较简单3D旋转效果

    HTML代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  6. http协议与网页优化泛谈

    最近公司开展职业技能培训,本人招录了部分内容写成博客,若有纰漏,欢迎拍砖. http简述: http又称超文本传输协议,是一种无状态&无记忆协议的运用层协议,处于tcp传输层协议之上,采用请求 ...

  7. [置顶]PADS PCB功能使用技巧系列之NO.006- 如何实现OrCAD与PADS Layout同步?

    很多同仁都喜欢用OrCAD画原理图,而PCB Layout则用PADS/PowerPCB,这两者被有些人誉为“黄金组合”,但由于两者并非一套软件,因此如何实现同步亦是需要急待解决的问题... (未完待 ...

  8. 20145301&20145321&20145335实验三

    20145301&20145321&20145335实验三 这次实验我的组员为:20145301赵嘉鑫.20145321曾子誉.20145335郝昊 实验内容详见:实验三

  9. 微信公共平台开发-(.net实现)2--ACCESSTOKEN值获得

    成功的走出第一步后,我们紧接着趁热打铁开始下一步: 成为了开发者之后微信平台会给您AppId和AppSecret,在订阅号中是没有的,所以因该申请一下服务号, 若没有请注意上一篇http://www. ...

  10. IIS部署Nodejs步骤

    需要iis的url重写插件 安装iisnode 配置文件 rewrite 节点需要url重写插件支持 node.exe 路径是你安装的路径 interceptor.js 是你安装iisnode的路径 ...