11 2016 档案

meta标签大全
摘要：前言： HTML/XHTML/DHTML并不简单，我想就单说一个meta标签都不见得有谁能完全掌握好（也许很多人根本都不会关心它）。 在我刚刚更新了IE到IE9时，发现了一个小现象，就是用IE9打开我做的页面时会出现“Compatibility View”按钮，而访问Google时就没有，这是为什么 阅读全文
posted @ 2016-11-23 16:20 micale 阅读(148) 评论(0) 推荐(0)
爆炸、翻转、扭曲、立方、翻页特效
摘要：baozha.js 阅读全文
posted @ 2016-11-22 12:40 micale 阅读(199) 评论(0) 推荐(0)
CSS3-多媒体查询
摘要：@media规则在css2中就有介绍，针对不同媒体颗星可以定制不同的样式规则。例如：你可针对不同的媒体类型(包括显示器、便携设备、电视机等等)设置不同的样式规则。但这些多媒体类型在很多设备上支持还不够友好 CSS3多媒体查询根据设置自适应显示。媒体查询可用于检测很多事情，例如： viweport(视 阅读全文
posted @ 2016-11-22 12:38 micale 阅读(3678) 评论(0) 推荐(0)
CSS3-按钮
摘要：按钮颜色 .button1 {background-color: #4CAF50;} /* Green */ 按钮大小 .button1 {font-size: 10px;} 圆角按钮 .button1 {border-radius: 2px;} 按钮阴影 box-shadow: 0 8px 16p 阅读全文
posted @ 2016-11-22 12:34 micale 阅读(254) 评论(0) 推荐(0)
CSS3-图片
摘要：圆角图片 img { border-radius: 8px; } 缩略图(用boder属性来创建) img { border: 1px solid #ddd; border-radius: 4px; padding: 5px; } 响应式图片 img { max-width: 100%; heigh 阅读全文
posted @ 2016-11-22 12:32 micale 阅读(192) 评论(0) 推荐(0)
css3-多列
摘要：多列 注意: Internet Explorer 9及更早 IE 版本浏览器不支持 column-count 属性。 英国维斯米斯特教堂碑文11111111111111111111111111111111111111111111111 当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发... 阅读全文
posted @ 2016-11-22 12:30 micale 阅读(226) 评论(0) 推荐(0)
动画的timing-function比较
摘要：animation-timing-function的参数： 值 属性 linear 动画从头至尾的速度是相同的 ease 默认，低速开始，加快，变慢结束 ease-in 动画以低速开始 ease-out 动画以词素结束 ease-in-out 动画以低速开始和结束 cubic-bezier(n,n, 阅读全文
posted @ 2016-11-22 12:29 micale 阅读(629) 评论(0) 推荐(0)
CSS3 动画详解
摘要：单纯的代码不会触发任何过渡操作，需要通过用户的行为（如点击，悬浮等）触发，可触发的方式有： :hoever :focus :checked 媒体查询触发 JavaScript触发 过渡的小结： transition的优点在于简单易用，但是它有几个很大的局限。 （1）transition需要事件触发， 阅读全文
posted @ 2016-11-22 12:26 micale 阅读(425) 评论(0) 推荐(0)
CSS3-过渡效果
摘要：CSS3 transition 允许 CSS 元素的属性值在一定的时间区间内平滑地过渡。我们可以在不使用 Flash 动画或 JavaScript 的情况下，在元素从一种样式变换为另一种样式时为元素添加效果。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变 CS 阅读全文
posted @ 2016-11-22 11:24 micale 阅读(327) 评论(0) 推荐(0)
CSS3-3d转换+示例旋转木马
摘要：css3提供了3D转换功能。允许使用3D转换来对元素进行格式化 transform:rotateX(360deg); //X轴旋转360 transform:rotateY(360deg); //Y轴旋转360 transform:rotateZ(360deg); //Z轴旋转360 transfo 阅读全文
posted @ 2016-11-22 11:21 micale 阅读(1114) 评论(0) 推荐(0)
CSS3-2D 转换
摘要：css3提供了2D转换功能，能够对元素进行移动、缩放和转动等功能。 2D转换的属性名为transform，使用方法为transform:method(value)。 2D转换方法有 translate()位移 根据给定的left（x坐标）和top（y坐标）位置参数 scale()缩放 scale（2 阅读全文
posted @ 2016-11-22 11:17 micale 阅读(363) 评论(0) 推荐(0)
CSS3-文本效果、字体
摘要：文本效果 text-shadow: 字体阴影 .text{ text-shadow:5 px 5px 5px #FF0000} 指定:水平阴影、垂直阴影、模糊的距离，以及阴影的颜色 box-shadow: 背景阴影 text-overflow: 文字溢出 .text{text-overflow:cl 阅读全文
posted @ 2016-11-22 11:13 micale 阅读(610) 评论(0) 推荐(0)
CSS3-渐变-线性渐变和径向渐变
摘要：线性渐变 语法：background: linear-gradient(direction, color-stop1, color-stop2, ...); 阅读全文
posted @ 2016-11-22 10:53 micale 阅读(569) 评论(0) 推荐(0)
CSS3中包含几个新的背景属性，提供更大的背景元素控制
摘要：background-image: .box{background-image:url();background-position:left bottom;} background-size: .box{background-size:100% 100%;} background-orgin: .b 阅读全文
posted @ 2016-11-22 10:49 micale 阅读(234) 评论(0) 推荐(0)
css3的边框详解
摘要：css边框的三个属性 border: 用法：.box{ border:border-width||border-style||border-color;}(第三个颜色使可选的) css3中可以创建圆角边框，添加阴影框，并作为边框的形象而不使用设计程序 用法 ：.box{ border-radius: 阅读全文
posted @ 2016-11-22 10:48 micale 阅读(346) 评论(0) 推荐(0)
CSS3-flex弹性布局
摘要：Css3的flex布局用法 Flex意为“弹性布局”，英文flexible box的缩写，flex布局使css盒模型变得更加强大和灵活，flex布局主要用在webapp和移动端中使用，移动端flex布局，将使的布局变得异常简单。 任何一个容器都可以指定为flex布局； 行内元素也可以使用flex布局 阅读全文
posted @ 2016-11-22 01:01 micale 阅读(3819) 评论(0) 推荐(0)
三种定位体系简介
摘要：框( box )布局影响因素之一，便是定位体系。定位体系也是其最为重要的影响因素。 CSS2.1 中，一个框可以根据三种定位体系布局。CSS2.1 中的定位体系帮助作者使他们的文档更容易理解，并不需要使用标记的手段（如，不可见的图片）达到布局的效果。 常规流( Normal flow ) 常规流，是 阅读全文
posted @ 2016-11-22 00:58 micale 阅读(1149) 评论(0) 推荐(0)