如何实现上传拖拽进入浏览器的文件

评论(0)浏览(363)分类：HTML/CSS兼容/XML
如何实现上传拖拽进入浏览器的文件　　通过HTML5的文件API ，Firefox、Chrome等浏览器已经支持从操作系统直接拖拽文件进入浏览器，并上传到服务器。　　让我们看一下Firefox 是如何使用拖拽上传功能的：　　１）首先提供一个区域来放置文件div name=image id=dropbox style=min-width:300px;min-height:100px;border:3px dashed silver;/div２）然后监听拖拽过程中的dragenter、d..

li list-style-type:decimal序号到9变为0

评论(0)浏览(424)分类：HTML/CSS兼容/XML
li list-style-type:decimal序号到9变为0　　昨天在用ul+li布局的时候，li的list-style-type设置为decimal，结果li的序号显示到9后，自动变为从0开始了，如下图所示。示例代码!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdstyle ul{padding:0px;margin:0px}li{margin-left:25px; list-style-type:decimal}/st..

table cellpadding属性无效

评论(0)浏览(1637)分类：HTML/CSS兼容/XML
table cellpadding属性无效　　设置了table的对象的cellpadding属性后，如果table单元格间没有出现指定padding间距，那么应该设置过td的样式，增加了padding:0px的样式，这样设置table的cellpadding就不起作用了。　　查找导入此页面的css文件或者内联style样式，找到类似的样式td{padding:0px}/*或者*/*{padding:0px}　　加这个样式的人脑子绝对是被驴踢过了的。。测试代..

javascript水平方向手风琴焦点图

评论(0)浏览(196)分类：JavaScript/Ajax开发技巧
javascript水平方向手风琴焦点图　　javascript水平方向手风琴焦点图，效果如下源代码如下!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdhtml xmlns=http://www.w3.org/1999/xhtmlheadtitlejavascript水平方向手风琴焦点图/titlemeta http-equiv=Content-Type content=text/html; charset=utf-8 /scri..

chrome浏览器font-size小于12px默认为12px解决办法

评论(0)浏览(790)分类：操作系统及应用软件
chrome浏览器font-size小于12px默认为12px解决办法　　当样式表里或者对象的style中设置了font-size12px，chrome浏览器里字体默认大小仍为12px，不是font-size设置的值。刚开始以为是xhtml申明的问题，结果是chrome自己的bug。　　解决的办法有两种第一种（推荐）：只需定义样式，webkit的私有属性：html{-webkit-text-size-adjust:none;} 第二种：在chrome浏览器工具栏 选项 高级选项 更改字..

firefox下javascript设置marquee innerHTML滚动bug

评论(0)浏览(205)分类：JavaScript/Ajax开发技巧
firefox下javascript设置marquee innerHTML滚动bug　　在firefox下，在当前的文档流完全关闭后设置marquee标签的innerHTML（我是这样理解的，具体就不清楚firefox下marquee的机制了，看下面的示例），如果内容长度大于marquee设置的长度，会导致滚动到边界时，内容重头滚定，而没有继续滚动剩余的内容。　　猜测可能是firefox文档流关闭时计算过marquee的宽度什么的，导致marquee内容宽度滚动。　..

禁止选择网页内容

评论(0)浏览(395)分类：HTML/CSS兼容/XML
禁止选择网页内容　　用css禁止选择浏览器显示的网页的内容user-select有两个值none：用户不能选择文本text：用户可以选择文本　　注意：user-select不是一个W3C的CSS标准属性，浏览器支持的不完善，各种浏览器的实现都不一样，需要针对不同浏览器加上对应的CSS，示例代码如下 body{ -moz-user-select: none; /*火狐*/ -webkit-user-select: none; /*we..

html标签marquee使用说明

评论(0)浏览(186)分类：HTML/CSS兼容/XML
html标签marquee使用说明　　MARQUEE 元素不属于 W3C 规范中的元素，它最初由 IE2.0 引入，是微软为 IE 浏览器发明的特有元素，然而目前所有的主流浏览器均支持 MARQUEE 元素。　　MARQUEE 元素用来创建一个文字滚动区域，并提供了一些特有的属性、方法及事件。语法marquee/marquee　　以下是一个最简单的例子：marqueefont size=+3 color=redHello, World/font/marquee..

CSS2，css3选择器总结

评论(0)浏览(114)分类：HTML/CSS兼容/XML
CSS2，css3选择器总结CSS选择器笔记阮一峰 整理参考网址：456 Berea Street一、基本选择器序号选择器含义1.*通用元素选择器，匹配任何元素2.E标签选择器，匹配所有使用E标签的元素3..infoclass选择器，匹配所有class属性中包含info的元素4.#footerid选择器，匹配所有id属性等于footer的元素实例： * { margin:0; padding:0; } p { font-size:2em; } .info {..

CSS跨浏览器颜色渐变

评论(0)浏览(129)分类：HTML/CSS兼容/XML
CSS跨浏览器颜色渐变　　Webkit大约在两年前推出CSS渐变特性，可惜由于大多数浏览器都对它不是很兼容，这个属性很少被使用。但是现在随着越来越多的浏览器对渐变 的支持，我们不必再通过图片来创造渐变的效果了。这篇文章将会告诉你如何通过CSS来创造对于主流浏览器都兼容的渐变：Firefox 3.6+、 Safari、Chrome和IE浏览器。对于Webkit浏览器下面代码适用于webkit浏..

IE颜色渐变滤镜FILTER:progid:DXImageTransform.Microsoft.Gradient

评论(0)浏览(535)分类：HTML/CSS兼容/XML
IE颜色渐变滤镜FILTER:progid:DXImageTransform.Microsoft.GradientIE颜色渐变滤镜progid:DXImageTransform.Microsoft.Gradient参数介绍及使用语法：filter:progid:DXImageTransform.Microsoft.Gradient(enabled=bEnabled,startColorStr=iWidth,endColorStr=iWidth)参数：enabled：可选项。布尔值(Boolean)。设置或检索滤镜是否激活。 true | false　　true: 默认值。滤镜激活。　　false:滤镜被禁止。startColor..

HTML5 Audio/Video属性,方法,事件列表

评论(0)浏览(553)分类：HTML/CSS兼容/XML
HTML5 Audio/Video属性,方法,事件列表audio 标签属性：src：音乐的URLpreload：预加载autoplay：自动播放loop：循环播放controls：浏览器自带的控制条Html代码audio id=media src=http://www.abc.com/test.mp3 controls/audio video 标签属性：src：视频的URLposter：视频封面，没有播放时显示的图片preload：预加载autoplay：自动播放loop：循环播放controls：浏览器自带的控制条w..

html5 required属性不用写js就能验证非空错误

评论(0)浏览(2062)分类：HTML/CSS兼容/XML
html5 required属性不用写js就能验证非空错误　　今天研究jquery.validation.js插件的时候，发现即使删除了页面上的所有js文件，提交表单的时候既然会提示请填写此字段的错误信息，神奇了。源代码如下form class=cmxform id=commentForm method=get action=label for=cemailE-Mail (required)/labelinput id=cemail type=email name=email required /pinput class=submit type=submit value..

li中嵌套img导致li垂直方向下端多出4px空白边解决办法

评论(0)浏览(302)分类：HTML/CSS兼容/XML
li中嵌套img导致li垂直方向下端多出4px空白边解决办法　　当li中嵌套了img元素时，li的垂直方向下端会莫名其妙的多出4px的空白边，ie6-7【以下简称ie】，firefox，chrome存在li空白边,firefox和ie6-7一样是4px，chrome下则是3px，IE8没有受到影响，神奇。。示例代码和布局图比较如下ul style=margin:0px;padding:0pxli style=margin:0px;padding:0px;zoom:1;overflow:hiddenimg src=v.png//li/ul　　..

css中table-layout:fixed结合nowrap使用示例

评论(0)浏览(152)分类：HTML/CSS兼容/XML
css中table-layout:fixed结合nowrap使用示例css table-layout:fixed使用效果：如果想要一个table固定大小，里面的文字强制换行(尤其是在一长串数字英文文本，中间无空格分隔的情况下)，以达到使过长的文字不撑破表格的目的，一般是使用样式：table-layout:fixed。但是在Firefox下面，会有一些问题，参考 Gmail的一些做法，做了几个测试，得出一种解决办法。例1：(IE浏览器)普通的情况table..

CSS3 transform制作的Windows徽标

评论(0)浏览(180)分类：HTML/CSS兼容/XML
CSS3 transform制作的Windows徽标　　CSS3 transform制作的Windows徽标，使用IE9+或者chrome，firefox等测试效果style#windows .canvas { background: #fff;}#windows .icon { left:193px; position: absolute; top:20px; -moz-transform: rotate(16deg); -webkit-transform: rotate(16deg); transform: rotate(16deg);}.window-e1,.window2,.window3,..

输入框onchange,oninput,onpropertychange事件区别

评论(0)浏览(569)分类：HTML/CSS兼容/XML
输入框onchange,oninput,onpropertychange事件区别输入框（input）onchange,oninput,onpropertychange事件区别和兼容行分析onchange触发条件：输入框的值改变，失去焦点(onblur)后触发。兼容性：各浏览器都支持。oninputonpropertychange触发条件：输入时，实时触发，而不是失去焦点才触发。兼容性：oninput：Chrome/IE9/Firefox/Safari/Operaonpropertychange：IE6/IE7/IE8/IE9所以如果要实现输..

css4选择器

评论(0)浏览(110)分类：HTML/CSS兼容/XML
css4选择器来源：http://www.wheattime.com/css4-selector.htmlCSS4选择器工作草案于2011年9月29日被发布。 新增了一些内容，我们来看看是哪些：一.复合选择器1.E:not(s1, s2)　　匹配所有既不包含s1选择器也不包含s2选择器的元素。是的，这个只是将css3的E:not(s)中1个参数变成2个，谁又会说这不是发展呢。例如*not（input，button）表示除input以及butto..

css修改鼠标选中内容显示样式

评论(0)浏览(178)分类：HTML/CSS兼容/XML
css修改鼠标选中内容显示样式　　通过样式修改鼠标选中的内容的颜色／背景色样式，而不是默认的深蓝色蓝底白色的字。　　本示例在IE8-浏览器下无效，如果是IE浏览器请升级到IE9+，chrome，opera，safari，firefox下运行看效果style*::-moz-selection{background:#93C; color:#FCF;}*::selection{background:#93C; color:#FCF;} /style通过样式修改鼠标选中的内容的颜色／背景..

CSS开启桌面端和移动端硬件加速

评论(0)浏览(113)分类：HTML/CSS兼容/XML
CSS开启桌面端和移动端硬件加速　　可以在浏览器中用css开启硬件加速，使GPU (Graphics Processing Unit) 发挥功能，从而提升网站性能。　　现在大多数电脑的显卡都支持硬件加速。鉴于此，我们可以发挥GPU的力量，从而使我们的网站或应用表现的更为流畅。　　在桌面端和移动端用CSS开启硬件加速　　CSS animations, transforms 以及 transitions 不会自动开启GPU加速，而是由浏..

解决ie下移动浮动层闪动问题

评论(0)浏览(776)分类：HTML/CSS兼容/XML
解决ie下移动浮动层闪动问题　　IE浏览器下如果使用setInterval/setTimeout计时器实现实时移动浮动层时，浮动层会有一些细微的闪动或者震动，因为IE有一个多步的渲染进程，当滚动或调整浏览器大小的时候，它将重置所有内容并重画页面，这个时候它就会重新处理css表达式。这会引起一个丑陋的闪动/振动bug，在此处固定位置的元素需要调整以跟上(页面的)滚动，就会出现跳动。　..

IE glow滤镜

评论(0)浏览(144)分类：HTML/CSS兼容/XML
IE glow滤镜　　IE glow滤镜：在对象边缘添加类似发光效果　　语法： STYLE=filter:Glow(Color=color,Strength=strength) 　　说明：Color:发光颜色. Strength:强度(0-100) 例子：filter:Glow(Color=#6699CC,Strength=5) 　　注意：作用域图片时，图片需要透明背景，要不不起作用。　　IE glow滤镜测试代码和效果style body{background:#ffffff} ..

IE gray，invert，xray滤镜

评论(0)浏览(107)分类：HTML/CSS兼容/XML
IE gray，invert，xray滤镜　　IE gray滤镜：把图片变为一张黑白颜色灰度图　　语法:：STYLE=filter:Gray　　IE invert滤镜：把对象的可视化属性全部翻转，包括色彩，饱和度和亮度　　语法：STYLE=filter:Invert　　IE Xray滤镜：使对象变得像被x光照射一样　　语法：STYLE=filter:Xray　　IE gray，invert，xray滤镜测试代码和效果style body{background:#ffffff} ..

XSLT教程

评论(0)浏览(126)分类：HTML/CSS兼容/XML
XSLT教程XML文档树1）XML可以转化文档树2）XSLT对XML的转化过程内建模板规则根调用xsl:apply-templates处理根节点的儿子。处理时，使用调用时相同的模式元素调用xsl:apply-templates处理该节点的儿子。处理时，使用调用时相同的模式属性拷贝属性值到结果树，结果作为文本而不是属性节点文本拷贝文本到结果树注释不做任何事处理指令不做任何事命名空间不做..

IE Chroma滤镜

评论(0)浏览(105)分类：HTML/CSS兼容/XML
IE Chroma滤镜　　IE Chroma滤镜：设置图片中指定的颜色为透明色，不显示原来的色彩语法filter:Chroma(Color=color)说明 ：color:#rrggbb格式，任意. 例子：filter:Chroma(Color=#FFFFFF) 备注：经测试，对文字容器的背景色不起作用，只作用于图片 IE Chroma滤镜示例style.chroma0{filter:Chroma(Color=#ff0000)}.chroma1{filter:Chroma(Color=#008000)}/sty..

IE FlipH,FlipV滤镜

评论(0)浏览(126)分类：HTML/CSS兼容/XML
IE FlipH,FlipV滤镜　　IE FlipH,FlipV滤镜：创建水平，垂直镜像语法filter:FlipVfilter:FlipHIE FlipH,FlipV滤镜示例，请在IE下运行stylebody{background:#ffffff}div{width:100px;height:100px;float:left;margin:0px 20px 20px 0px}.FlipH{filter:FlipH}.FlipV{filter:FlipV}/styledivFlipH,FlipV滤镜，原始效果/divdiv class=FlipH/作用于FlipH下的文字效果/di..

IE DropShadow滤镜

评论(0)浏览(146)分类：HTML/CSS兼容/XML
IE DropShadow滤镜　　IE DropShadow滤镜：创建对象的固定影子语法filter:DropShadow(Color=color,OffX=offX,OffY=offY,Positive=positive) 说明 Color:#rrggbb格式，任意. Offx:X轴偏离值. Offy:Y轴偏离值. Positive:1或0.如果为TRUE（非0），就为任何的非透明像素建立可见的投影 如果为FASLE（0），就为透明的像素部分建立透明效果 例子：filter:DropShadow..

IE blur滤镜

评论(0)浏览(171)分类：HTML/CSS兼容/XML
IE blur滤镜　　IE blur滤镜：创建高速度移动效果，即模糊效果语法filter:Blur(Add=add,Direction=direction,Strength=strength)说明 Add：是一个布尔值，一般来说，当滤镜用于图片时取0，用于文字时取1。文字设置add=1时会整个字体增加移动效果，会很模糊注意设置add的值。 Direction：模糊方向，以45度为单位改变，0为垂直向上，45向右上，90水平向右，13..

IE alpha滤镜

评论(0)浏览(150)分类：HTML/CSS兼容/XML
IE alpha滤镜　　IE alpha滤镜：设置透明层次语法 filter:Alpha(Opacity=opacity,FinishOpacity=finishopacity,Style=style,StartX=startX,StartY=startY,FinishX=finishX,FinishY=finishY)说明opacity代表透明度水准。默认的范围是从0 到 100，他们其实是百分比的形式。也就是说，0代表完全透明，100代表完全不透明。finishopacity是一个可选参数，如果想要..

CSS3 transform变形使用方法示例

评论(0)浏览(171)分类：HTML/CSS兼容/XML
CSS3 transform变形使用方法示例　　在CSS3中，用Transform功能可以实现文字或图像的旋转、缩放、倾斜、移动这四种类型的变形，这四种变形分别使用rotate、 scale、skew和translate这四种方法来实现。将这四种变形结合使用，就会产生不同的效果，使用顺序不同，产生的效果是不一样的。　　目前浏览器支持情况：Safari 3.1+、 Chrome 8+、Firefox 4+、Opera 10+、IE9+来源：http..