一. Prototype.__proto__与Object.Function关系介绍 Function.Object:都是Js自带的函数对象.prototype,每一个函数对象都有一个显式的prototype属性(普通对象没有prototype),它代表了对象的原型(Function.prototype是一个对象,有constructor和__proto__两个属性,constructor指向构造函数本身,__proto__指向于它所对应的原型对象).__proto__:每个对象都有一个名为__…

html5/css3响应式布局介绍 html5/css3响应式布局介绍及设计流程,利用css3的media query媒体查询功能.移动终端一般都是对css3支持比较好的高级浏览器不需要考虑响应式布局的媒体查询media query兼容问题 一个普通的自适应显示的三栏网页,当你用不同的终端来查看这个页面的时候,他会根据几种终端来显示不同的样式,在电脑上是三列,在pad上应该也是 三列,在大屏手机上是三行,在屏幕小于320的手机上只显示主要内容,隐藏掉了次要元素.(这里关于响应式布局还有个比较好的…

一    Prototype.__proto__与Object.Function关系介绍        Function.Object:Js自带的函数对象.         prototype,每一个函数对象都有一个显示的prototype属性,它代表了对象的原型(Function.prototype函数对象是个例外,没有prototype属性).         __proto__:每个对象都有一个名为__proto__的内部隐藏属性,指向于它所对应的原型对象(chrome.firefox中名…

在应用 CSS3 渐变/动画时.有个控制时间的属性 <timing-function>.它的取值中除了经常使用到的三次贝塞尔曲线以外,还有个steps() 函数. steps 函数指定了一个阶跃函数,第一个參数指定了时间函数中的间隔数量(必须是正整数):第二个參数可选.接受 start 和 end 两个值.指定在每一个间隔的起点或是终点发生阶跃变化,默觉得 end. #demo { animation-iteration-count: 2;//动画反复两次 animation-duration…

在应用 CSS3 渐变/动画时,有个控制时间的属性 <timing-function> .它的取值中除了常用到的三次贝塞尔曲线以外,还有个让人比较困惑的 steps() 函数. steps() 第一个参数 number 为指定的间隔数(必须是正整数),即把动画分为 n 步阶段性展示,第二个参数默认为 end,设置最后一步的状态,start 为结束时的状态,end 为开始时的状态. 那么有了这个steps(),我们就可以实现web中常见的Sprite 精灵动画了,见demo: <!DOCT…

用户的屏幕越来越大,而页面太宽的话会不宜阅读,所以绝大部分网站的主体宽度和之前相比没有太大的变化,于是浏览器中就有越来越多的空白区域,所以你可能注意到很多网站开始在滚动的时候让一部分内容保持可见,比如,侧边栏的部分区域.position:sticky为此而生. position:sticky用法 position:sticky是一个新的css3属性,它的表现类似position:relative和position:fixed的合体,在目标区域在屏幕中可见时,它的行为就像position:rela…

animation默认以ease方式过渡,它会在每个关键帧之间插入补间动画,所以动画效果 是连贯性的.除了ease,linear.cubic-bezier之类的过渡函数都会为其插入补间. 但有些效果不需要补间,只需要关键帧之间的跳跃,这时应该使用steps过渡方式. 比如GIF动图不支持程序对播放的控制,也不支持Alpha通道.但如果我们用一个 PNG图片,把所有帧都放在一起,通过CSS3的animation控制background-position 来播放就可以做到这些. <style> @…

CSS是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了,如何选择对应的元素,此时就需要我们所说的选择器.选择器主要是用来确定html的树形结构中的DOM元素节点.我把CSS选择器分开成三部分,第一部分是我们常用的部分,我把他叫做基本选择器:第二部分我把他称作是属性选择器,第三部分我把他称作伪类选择器,这一部分也是最难理解和掌握的部分,今天我们先来看第一部分——基本选择器.我们先来看一个常用的选择器列表图…

Media Queries 就是要在支援CSS3 的浏览器中才能正常工作,IE8 以下不支援. 而Media Queries 的套用方法千变万化,要套用在什么样的装置中,都可以自己来定义. 关于Media Queries 到底什么是Media Queries ? 一般我们在开发HTML + CSS 网页中,都会有一份CSS 来控制网页的样式表. 而随着各式各样不同大小.长宽与解析度的装置的兴起,我们在开发网页只考虑到自己的萤幕显示的如何,是多么的肤浅哪. So,在开发者的萤幕看到的网页或许很漂亮…

本篇文章由:http://xinpure.com/css3-animation-steps-properties-for-analogue-effects/ animation 默认以 ease 方式过渡,它会在每个关键帧之间插入补间动画,所以动画效果是连贯性的.除了ease,linear.cubic-bezier之类的过渡函数都会为其插入补间.但有些效果不需要补间,只需要关键帧之间的跳跃,这时应该使用 steps 过渡方式,而时钟的指针嘀嗒旋转,就应该使用这种方式. 时钟动画分析 时钟的动画效…