51CTO博客开发
对css opacity属性的验证对于一个opacity < 1的元素,它具有这样的特性:1.其具有一个独立的层叠上下文2.其内部元素无法脱离这个上下文(始终保持opacity的样式)3.其外部元素无法进入这个上下文(无法具有opacity的样式)源于:http://www.w3.org/html/ig/zh/wiki/Css3-color#.E9.80.8F.E6.98.8E.E5.BA.
经过一段时间情绪的低迷,重整旗鼓,戎装待发,重新上路。开始更新自己的博客,对看到的、想到的、碰到的经验进行总结,让这些东西沉淀下来,有个归宿。访问别人的博客时间长了,不容易找到目标,事情的难度不在于其复杂度,而在于坚持。
NodeJs+Qunit的使用方式: 1.安装Qunit: sudo npm install qunit 可以使用 npm list进行查看是否安装成功,如果安装成功list里面会有qunit。 2.可以指定目录结构为: main.js /src /tests 3.编写需测试文件: 在/src创建文件t.js exports.tt = functio
HTML代码: <body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script src="/v1/resources/js/a.js"></script
代码: 效果: 基本思路: 1.设置元素的高度为0(指针的高度从border-bottom开始计算) 2.设置指针的宽度 3.设置border-bottom(指针的高度由该属性的宽度决定,颜色有该元素的背景色决定) 4.设置border-left,border-right 由于width = content+padding+border,现在padding为0, 所以整
png无损压缩: pngout: http://advsys.net/ken/util/pngout.htm png24转成png8:(无效果影响,且文件大大减小) pngguant: http://pngquant.org/ (win上选择PNGoo下载)
这里记录了垂直居中有几种方式:http://james.gameover.com/index.php/2009/vertically-centring-in-css-without-hacks-and-multi-line-enabled/ 下面要说的是利用CSS3的弹性盒模型及相关属性制作的一个水平和垂直方式居中的例子。 代码结构如图: CSS代码: 实现方式非常
公司最近在移动版的safari上在做了一个web app如图: 中间是一张比较大的图片,两边各是一按钮。 布局是,大图片水平居中,两个侧边按钮垂直居中。点击侧边按钮时屏幕翻滚并显示下一个页面。 这个布局里面这三个元素位于一个父元素里面,同时父元素相对定位,两个侧边按钮绝对定位,来实现垂直居中。 看似没有任何问题,但是当中间的大图片超出iphone或者ipod可视区域,safari将
CSS3 弹性盒模型 实例代码: 实例效果: 注意:要使弹性盒模型生效,需设置元素的display值为box或inline-box。 属性说明: box-orient: horizontal || vertical,默认值为horizontal a) horizontal vertical分别设置弹性盒模型的子元素水平或纵向排列 =============
W3C盒模型与IE怪癖模式下盒模型的区别: 代码示例: IE在怪癖模式下渲染结果: FF下渲染结果: IE怪癖模式下渲染盒模型: FF下渲染盒模型: 说明:IE在怪癖模式下盒子的大小取决于元素里面的内容,也就是说例子中盒子的大小会随着div或者p中的内容进行调整。 引发IE怪异模式的原因: a) 文件类型描述缺失或不完整时; b) 遇到一个H
CSS3 outline 边框轮廓 属性说明: outline: [outline-width] || [outline-style] || [outline-color] a) 画在border外面的线 b) 不允许想border那样拆分成border-top等 c) 不会修改盒子的大小 outline-offset: a) 轮廓线与border之间的宽度 b) 不会修改盒子
CSS3 animation 动画 实例代码: 属性取值说明: animation: animation-name animation-duration animation-timing-function animation-delay animation-iteration-count animation-direction; a) 可以设置多个动画,每个动画之间使用','号并
CSS3 多列布局 columns a.column-width 每列的宽度 实例代码: 说明: 1.如果内容的宽度小于所设置内容的宽度,则只出现一列,并且不会影响元素本身的display属性。如果内容的宽度大于所设置的值,则会用内容的宽度除以所设置的值形成多列现象。 2.多列布局只能用于块元素上。(比如在span上这个属性将不会起作用) b.column-count
1.线性渐变: -moz-linear-gradient(bottom, #7bcd21, yellow 100%); a) 第一个参数表示渐变的方向。--可以不设置 b) 后面的参数为渐变的颜色及开始渐变的位置,值可以为固定值及百分比。--可以设置多个 注意: a) 颜色和渐变开始位置值之间用空格 b) 渐变色的起始位置会影响其他渐变色的位置 c) 渐变色的起始位置值可
上次学习到jQuery的构成,接下来学习jQuery核心部分的extend。它是制作插件的一种方式。 上次说到了jQuery.fn也就是jQuery的原型,而jQuery的extend是jQuery.fn的属性。 extend是一个函数,它的返回值有两种情况,对象或是jQuery构造函数的引用。 现在要说的是返回值是jQuery构造函数的情况。 在代码(26行)jQue
最近花了一些时间看了一下jQuery的源码,以下部分是我对源码的核心部分进行的提取。这样能更清晰的看清jQuery本身的结构,接下来对这段核心的代码进行详细的分析。只限于对目前对jQuery的理解层次。 1.首先jQuery同样被包裹在一个匿名块里面,接着对这个匿名块进行了调用, 并且传递的参数为window,可能还包括undefined,在这部分暂不做分析。 之所以传递
http://goddyzhao.tumblr.com/post/11141710441/variable-object
当看到这个API时心里的兴奋程度难以表达,因为目前的项目也恰好需要这样的API。 内容来源于《html5 高级程序设计》,是一本非常值得看的书。 下面是HTML5 Geolocation API的数据来源方式,以及各个方式的比较情况。 1.IP地址 其返回的位置信息通常不靠谱。实现方式是:查找用户ip地址,然后检索其注册的物理地址。如果ip地址是ISP提供的,其位置信息往往就由
在项目中使用jquery的bind方法遇到一种情况:(问题的简单示例) <html> <head> <title>test jquery bind event</title> <script s
http://developer.51cto.com/art/200908/143733.htm
Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号