牛X的CSS3】的更多相关文章

Animate.css是一款很牛逼的,跨浏览器的css3动画库,使用方法也很简单只要引入一个animate.min.css就可以了, 简单使用 1 首先引入 animate的 css 文件样式 cdn文件 <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"> </head…
写css3的属性的时候,最好加上浏览器内核标识,进行兼容. -ms-transform:scale(2,4); /* IE 9 */ -moz-transform:scale(2,4); /* Firefox */ -webkit-transform:scale(2,4); /* Safari and Chrome */ -o-transform:scale(2,4); /* Opera */ 1.圆角(常用:略)   2.边框阴影 box-shadow 属性向框添加一个或多个阴影. box-s…
See the Pen Dot Wave by Rich Howell (@roborich) on CodePen…
1. pointer-events:none; 2. flex 今天看到一个牛X的CSS3属性 flex, 称为弹性盒子.  这中属性完全可以替代媒体查询啦 使用方法: 父元素使用属性display:flex;  子元素使用margin:auto;  子元素就会自动适应父元素的宽高平均分布在父元素内,并且水平.垂直居中: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U…
display:flex 多栏多列布局浏览器支持情况:火狐直接支持w3c无前缀写法,谷歌和opera支持-webkit- 前缀写法,比较适合移动端开发使用, display:flex 这个牛逼的css3布局属性,遗憾的是只有谷歌和火狐支持,中国人常用的手机上的浏览器几乎全军覆没,UC浏览器不支持,安卓4.1.1和之前版本手机自带的浏览器也不支持,微信自带浏览器也不支持. 示例: html,body{ padding:0; margin:0;} /* flex-flow: row wrap; ro…
Sublime   常用插件简介 emmet: 前端必备神器.花个十几分钟学下Emmet语法 ,就可以极大提高web开发者HTML和CSS工作效率啦.一句话,牛逼---必备 CSS3: CSS3语法高亮.CSS语法提示,但是浏览器的私有属性不会高亮.     -----必备 CSS Extended Completions: 提示css文件(包括关联进来的)中的类名,非常好用. JavaScript Completions javascript原生语法提示, jQuery 提供了jQuery的A…
转自:http://www.360doc.com/content/14/0811/01/2633_400926000.shtml display:flex 多栏多列布局浏览器支持情况:火狐直接支持w3c无前缀写法,谷歌和opera支持-webkit- 前缀写法,比较适合移动端开发使用, display:flex 这个牛逼的css3布局属性,遗憾的是只有谷歌和火狐支持,中国人常用的手机上的浏览器几乎全军覆没,UC浏览器不支持,安卓4.1.1和之前版本手机自带的浏览器也不支持,微信自带浏览器也不支持…
通过 CSS3 的 content 获取内容,很有意思的一个思路,实际场景中有可能用的到: CSST (CSS Text Transformation) 利用js动态创建一个link插入到文档中, 请求css文件. 利用 computedStyle = window.getComputedStyle 获取指定元素的 style 对象 利用 computedStyle .content 获取内容 服务端可以返回的 css 文件内容: @keyframes anima { from {} to {…
一.web font web font是应用在web中的一种字体技术,在CSS中使用font-face定义新的字体.先了解操作系统中的字体: a).安装好操作系统后,会默认安装一些字体,这些字体文件描述了每一个文字的形态,一般中文文件大,英文文件小,因为中文字符数多:在控制面板中可以找到文字文件夹,在C:\Windows\Fonts下也可以直接找到.另外如果想让自己的电脑上有更加丰富的字体,可以下载新的字体文件后复制到改位置. b).我们在文档中显示的字体应该在系统中能找到才会正常显示,比如你在…
经常有客户咨询说你们会做H5吗,就像这个,拿过来一看,一个上下滑动的贺卡,这已经成为了大部分人对H5的理解,甚至很多大公司都推出了制作这种动画的工具,可以快速生成此类页面.(其实,这就用到了一些CSS3的技巧,好吗!!!) 我大H5就是你们说的这样吗,伤心!!!! H5可是个牛逼闪闪的东西,且是你们说的那么低端 从大名鼎鼎w3school上可以了解到H5其实包含了很多的内容,有众多的新标签,canvas,svg,地理位置,web存储,应用缓存,web workers等,你们这些鸟人就知道nav,…