使png图片在ie6浏览器下也支持透明

评论(0)浏览(247)分类：HTML/CSS兼容/XML
使png图片在ie6浏览器下也支持透明没有使用滤镜来修正ie下png透明的效果，这样会出现灰色的边。stylebody{background:#000000;margin:100px;}.kuang{background:url(/images/kuang.png) no-repeat center center ;width:134px;height:144px;}/style div class=kuang/div使用滤镜及important【for w3c】后，灰色边框不见了，效果一比较就知道stylebody{background:#000000;margin:..

IE7下的185个bugs

评论(0)浏览(244)分类：HTML/CSS兼容/XML
IE7下的185个bugs来源：185 bugs inIE7 for Windows1- Non-defined value of option is not set to the contents of the OPTION element Firefox 1.x, Firefox 2.x, Opera 9.x, Safari 2, Safari 3.0.2, Konqueror 3.5.8, Seamonkey 1.x, Seamonkey 2.x, NS 7.2, K-meleon 1.x, Galeon 2, Epiphany 2 all pass this test. Another interesting testcase for this..

浮动层div遮盖select

评论(0)浏览(239)分类：HTML/CSS兼容/XML
浮动层div遮盖selecthtmlhead meta http-equiv=Content-Type content=text/html; charset=gb2312 titleJK:支持民族工业,尽量少买X货/title/headbody div style=z-index:10;position:absolute;width:100;height:18;overflow:hidden; onmouseover=this.style.height=100; onmouseout=this.style.height=18; iframe style=position:absolute;z-index:-1;width:100%;he..

CSS media使用技巧

评论(0)浏览(228)分类：HTML/CSS兼容/XML
CSS media使用技巧　　在css中我们使用media标签来区分调用哪个css样式，比如使用media=print来表示当执行打印文档时，使用print.css样式。这样使得文档更有得于打印，如将页面宽度增宽、或屏蔽掉一些不需要打印的内容。link href=styles/main.css rel=stylesheet type=text/css media=screen /link href=styles/print.css rel=stylesheet type=text/css media=pr..

HTML5 Geolocation获取地理位置

评论(0)浏览(226)分类：HTML/CSS兼容/XML
HTML5 Geolocation获取地理位置　　　Geolocation API用于将用户当前地理位置信息共享给信任的站点，这涉及用户的隐私安全问题，所以当一个站点需要获取用户的当前地理位置，浏览器会提示用户是允许 or 拒绝。　　哪些浏览器支持Geolocation API：IE9.0+、FF3.5+、Safari5.0+、Chrome5.0+、Opera10.6+、IPhone3.0+、Android2.0+，也就是说除IE6~IE8外，其它最新的浏览器基本上..

css hover伪类

评论(0)浏览(223)分类：HTML/CSS兼容/XML
css hover伪类　　:hover伪类应用处于悬停状态的元素。悬停定义为用户指示了一个元素但没有将其激活。对此最常见的例子是将鼠标指针移到 HTML 文档中一个超链接的边界范围内。理论上，其他元素也可以处于悬停状态，在css2的定义中:hover伪类可以应用在全部元素上。　　但是在ie6浏览器下面，只有链接标签a支持:hover伪类，对于ie6需要使用js，而ie7/ff/op/sa直..

HTML 5 WebSocket Java示例

评论(1)浏览(222)分类：JavaScript/Ajax开发技巧
HTML 5 WebSocket Java示例 转载请保留作者信息：作者：88250 时间：2010 年 1 月 1 日 我们通过一个简单的例子来熟悉 HTML 5 WebSocket。该例子服务端从 0 开始每秒递增一个整数并发送给客户端浏览器显示。准备：下载 Jetty 7 ，Java Web 开发环境，Chrome 4+ 。服务端 Java 代码：final public class CounterSocketServlet extends WebSocketServlet { @Override protect..

firefox下button内嵌span会出现移位bug

评论(0)浏览(221)分类：HTML/CSS兼容/XML
firefox下button内嵌span会出现移位bug　　在Firefox下，如果button内部嵌入span，button和span的display都为block，width，height都一致时，span无法完全遮盖住button控件，button和span会出现一些边距，在Firefox3.6下面，左边相差3px，顶部相差 2px，不知道是不是Firefox的bug。　　在IE浏览器和chrome浏览器下不会出现这种问题。测试代码如下+展开-HTMLstyletype="text/css".jsbu..

doctype中html和html区别

评论(0)浏览(220)分类：HTML/CSS兼容/XML
doctype中html和html区别XHTML文档必须具有良好完整的排版(well-formed)　　编排良好性(Well-formedness)是XML引入的一个新概念.从本质上说,元素必须有结束标签,或者必须以特殊方式书写,而且元素必须嵌套.尽管SGML规定重叠(overlapping)是非法的,但现有的浏览器普遍允许重叠.正确:嵌套元素(nested elements) code class=tag/codecode class=tagp/codecode class=tag/..

javascript实现IE,firefox客户端图片预览

评论(0)浏览(219)分类：JavaScript/Ajax开发技巧
javascript实现IE,firefox客户端图片预览　　javascript实现IE,firefox客户端图片预览，测试浏览器：IE6~8，firefox4.0。　　google的chrome，safari，opera浏览器需要上传图片才行，这个不在讨论范围，上传后也变简单多了，将表单自动提交到隐藏iframe实现无刷新上传图片文件后，在服务器端保存图片然后返回路径，具体参考这篇文章：ajax无刷新上传文件，使用iframe模仿。　　原理：由..

chrome frameset鼠标调整宽度后设置rows无效

评论(0)浏览(217)分类：JavaScript/Ajax开发技巧
chrome frameset鼠标调整宽度后设置rows无效　　chrome浏览器下，frameset中的frame没有设置为noresize时，是可以通过鼠标来拖拽更改frame大小的（多有浏览器都可以），但是在chrome下如果鼠标拖拽更改过frame的大小，再设置frameset的rows/cols属性后，将无效，不会按照rows/cols设置的大小更改frame大小。如果要实现某个frame显示隐藏，将不会隐藏frame。　　测试代码如下1.htmlframeset..

IE/Firefox/W3C浏览器代码触发事件

评论(0)浏览(215)分类：JavaScript/Ajax开发技巧
IE/Firefox/W3C浏览器代码触发事件　　firefox或者w3c浏览器没有直接在DOM中添加onclick事件，而是通过addEventListener添加事件时，无法使用 DOMObject.onclick()使用这种方法触发事件，但是可以通过dispatchEvent来触发。　　测试代码如下div id=dvEvtdiv的内容/divinput type=button value=触发事件 onclick=btnFireEvent() /script type=text/javascript var dv; windo..

div模拟select左右移动效果

评论(0)浏览(207)分类：JavaScript/Ajax开发技巧
div模拟select左右移动效果　　div模拟select option对象左右移动效果，同时增加右边货物自动增加效果。　　源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js/scriptstylea{text-decoration:none}.select{overflow:auto;width:100px;height:120px;float:left;border:solid 1px #ccc;line-height:20px; -moz-user-se..

firefox下javascript设置marquee innerHTML滚动bug

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

9个最常见IE的Bug及其fix

评论(0)浏览(207)分类：HTML/CSS兼容/XML
9个最常见IE的Bug及其fixInternet Explorer – Web程序员的毒药。在IE上开发时间中有超过60%的时间是花在和IE的bug进行搏斗，让你的开发生产率严重下降。下面是一个教程，告诉你9个IE上最常见的BUG以及如何解决它们。1. 居中布局创建一个CSS定义把一个元素放到中间的位置，可能是每一个Web开发人员都会做的事情。最简单的做法是为你的元素增加一个margin: auto; ，然而 ..

IE7/IE8浏览器中透明滤镜失效

评论(0)浏览(206)分类：HTML/CSS兼容/XML
IE7/IE8浏览器中透明滤镜失效关键词：IE7 IE8 透明滤镜 alpha opacity 滤镜　　在IE7+浏览器中使用透明滤镜alpha时，如果没有设置过浏览器的安全“二禁止脚本行为”为“允许”，透明效果是不显示出来的。　　如下所示，一个lightbox的效果，在使用了透明滤镜后，没有显示出透明效果来。+展开 -CSS.lightbox{-moz-opacity:0.5;filter:alpha(opacity=50);opacity:0.5;backgrou..

iframe嵌套图吧地图在线标点地图

评论(0)浏览(206)分类：HTML/CSS兼容/XML
iframe嵌套图吧地图在线标点地图　　图吧地图在线标点地图在线生成地址：http://union.mapbar.com/onlineTagging.jsp，注册激活账户后生成地图标注界面如下　　图吧在线标点地图需要注册才能生成iframe引用的地址，效果如下。　　iframe引入的图吧在线标点地图效果

IE子元素float left碰到父容器边界子元素居右bug

评论(0)浏览(206)分类：HTML/CSS兼容/XML
IE子元素float left碰到父容器边界子元素居右bug　　IE下一个简单的css菜单，父元素li float布局，position relative，子菜单ul position absolute定位定宽，然后子菜单li元素也是float定位，定宽，为父元素宽度1/2，设置line-height，并排显示2个，但是发现在ie8+下，有个子菜单的li居然居右，firefox，chrome，ie7（IE就是怪咖啊，ie7尽然正常，ie8+不正常）下显示正常。　　结构大概如下IE8..

IE解析XML文档碰到DTD声明出错

评论(0)浏览(205)分类：HTML/CSS兼容/XML
IE解析XML文档碰到DTD声明出错IE解析XML文档碰到DTD声明出错　　在IE浏览器下查看xml文件，如果使用了DTD外部申明，DTD文件中如果有中文字符，则DTD文件需要存储为utf-8的编码，要不在IE下浏览使用了外部申明的XML文件时，解析DTD文件会出错。　　而使用内部的 DOCTYPE 声明时，XML文件不需要一定存储为utf-8，只需要存储编码和xml申明的编码一致就行，要不出错。　　　　总结..

a标签的伪类书写顺序

评论(0)浏览(205)分类：HTML/CSS兼容/XML
a标签的伪类书写顺序问题描述　　曾经在调试自己的网页是发现过一个问题，链接的文字只有在 IE6 下当鼠标移到上面的时候会变色，在 IE7、IE8 和其它浏览器里都不变色，感觉很奇怪。先来看一下我原来的代码：+展开-HTML!DOCTYPEhtmlstyletype="text/css"a:hover{color:red;}a:link{color:black;}a:visited{color:blue;}a:active{color:green;}/styleahref="#"testtes..

hta使用帮助

评论(0)浏览(204)分类：HTML/CSS兼容/XML
hta使用帮助　　HTA是HTML Application的缩写（HTML应用程序），是软件开发的新概念，直接将HTML保存成HTA的格式，就是一个独立的应用软件，双击就能运行，与VB、C++等程序语言所设计的软件没什么差别。原来网页中的工具栏、地址栏以及菜单栏在这个窗口里都没有被显示出来，还可以使用html中的绝大多数标签、脚本等，这就给予你对界面设计更多的控制权。　　..

隐藏IE textarea控件滚动条

评论(0)浏览(203)分类：HTML/CSS兼容/XML
隐藏IE textarea控件滚动条　　IE浏览器下面textarea即使没有内容，也会在右边显示一个灰色的滚动条，如下图所示　　在IE下要隐藏textarea的滚动条，只需要增加style=overflow:hidden或者auto就可以隐藏灰色滚动条了。textarea rows=5 cols=50 style=overflow:auto/textarea

canvas save和restore方法

评论(0)浏览(203)分类：HTML/CSS兼容/XML
canvas save和restore方法　　 应用到画布上面的效果是可以累积的，因而就可以利用几个简单的函数来组合出效果来。例如，在向屏幕上绘制之前，可能会有一艘飞船需要旋转、变换 和缩放。因为所有效果都对画布起作用，所以这些效果会应用到将被绘制在屏幕上的所有对象，而不仅仅是某一幅图像或某一个形状（比如一艘飞船）。　　其中，save和restore函数为应用这些累积的效果..

DOCTYPE xhtml对body高度影响

评论(0)浏览(203)分类：HTML/CSS兼容/XML
DOCTYPE xhtml对body高度影响　　xhtml申明css1compat模式下，body没有内容，IE，chrome下点击时无法响应事件，但是firefox会响应，即使document.body.clientHeight不为0，firefox的bug？ !doctype htmltitlecss1compat模式下，body没有内容，IE，chrome下点击时无法响应事件，但是firefox会响应，即使document.body.clientHeight不为0，firefox的bug？。。/titlescript typ..

Iframe编辑器设置图片的长或者宽会发生等比伸缩

评论(0)浏览(202)分类：HTML/CSS兼容/XML
Iframe编辑器设置图片的长或者宽会发生等比伸缩　　今天在修改网上下载的新浪编辑器的一些功能时候，发现iframe编辑在IE下如果重新设置图片的长或者宽，会出现图片等比缩小或者放大的问题。　　起因：由于iframe编辑器中，如果Firefox插入flash对象或者embed标签，不会显示在iframe编辑器内，即使设置了embed标签的或者宽，也不会占用位置，这样在Firefox下就无法查看视屏动画文件占用的位置了..

CSS3圆角样式(IE9支持)

评论(0)浏览(201)分类：HTML/CSS兼容/XML
CSS3圆角样式(IE9支持)　　CSS3中的圆角样式只有在IE9中才支持，IE8-的浏览器不支持圆角属性，只能靠vml来实现，要想在IE8-浏览器下实现圆角属性，请参考htc解决IE不支持CSS 3圆角属性。下面描红的部分为IE9支持的css3圆角属性，不同浏览器样式不一样。CSS3的border-radius规范属性：border-top-right-radiusborder-bottom-right-radiusborder-bottom-right-radiusbor..

label标签在IE，w3c浏览器firefox下的区别

评论(0)浏览(199)分类：HTML/CSS兼容/XML
label标签在IE，w3c浏览器firefox下的区别关键字：表单，label，提交按钮，分组在IE浏览器和w3c浏览器，如Firefox的异同　　label标签在w3c浏览器[如Firefox，google的chrome]下有分组的功能，点击label非第一个子节点的时候，会触发第一个子节点的相应的默认事件或者添加的对应的事件，IE下则不会。　　依我自己的理解是，在w3c浏览器下，使用label作为控件容器时，只有对第一个子节点操..

javascript水平方向手风琴焦点图

评论(0)浏览(198)分类：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..

CSS3动画Transform-style介绍

评论(0)浏览(198)分类：HTML/CSS兼容/XML
CSS3动画Transform-style介绍CSS3 transform-style属性transform-style属性是3D空间一个重要属性，指定嵌套元素如何在3D空间中呈现。他主要有两个属性值：flat和preserve-3d。transform-style属性的使用语法非常简单：transform-style: flat | preserve-3d其中flat值为默认值，表示所有子元素在2D平面呈现。preserve-3d表示所有子元素在3D空间中呈现。　　也就是说，如果对一..