浏览器滤镜大全

评论(0)浏览(168)分类:HTML/CSS兼容/XML
浏览器滤镜大全firefox只支持透明滤镜,为兼容ie可以使用下面的css即可-moz-opacity:0.5;/*其他类型Mozilla浏览器*/opacity:0.5;/*火狐,当然上面的火狐也支持*/filter:alpha(opcatiy=50);/*ie的,注意ie下是0-100,而火狐和Mozilla是0-1*/下面的都是ie支持的反转滤镜:fliphfilter:fliphtest.htmlstyleIMG {border:2px solid black}BODY{ margin:0;background..

canvas绘制阴影效果

评论(0)浏览(167)分类:JavaScript/Ajax开发技巧
canvas绘制阴影效果  HTML5的Canvas自带API可以显示阴影效果,主要还是在画布(canvas)的上下文对象(context)上做文章 !DOCTYPE html head meta charset=UTF-8 titleHTML5 Combine Shape DEMO/title script type=text/javascript src=js/drawShadow.js/script /head body onload=draw('canvas')/body h2canvas:显示..

IE下使用透明滤镜出现锯齿解决办法

评论(0)浏览(166)分类:HTML/CSS兼容/XML
IE下使用透明滤镜出现锯齿解决办法  IE浏览器下使用alpha透明滤镜时,文字或者图片边缘会出现锯齿,测试代码!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/xhtmlheadmeta http-equiv=Content-Type content=text/html; charset=utf-8 /titleIE下使用透明滤镜出现锯齿..

常见左右两列div+css布局技巧整理

评论(0)浏览(166)分类:HTML/CSS兼容/XML
常见左右两列div+css布局技巧整理在百度搜索‘左右布局’,发现好多朋友在问这个问题,特将上周学到的左右布局技巧整理分享给大家:)常见的左右两列div+css布局分为以下两种:一、左右定宽布局:在css分别指定了左右两列的宽度的情况下,只需要将左边的div 向左浮动{float:left;},右边的div 向右浮动{float:right;},并清除浮动,即可实现。常用的清除浮动有两种方式:a、通过..

如何去掉链接点击时虚线框

评论(0)浏览(166)分类:HTML/CSS兼容/XML
如何去掉链接点击时虚线框下面是去掉链接点击时虚线框的几种常用方法:方法缺点兼容性taba href=”#” onfocus=”this.blur()”this blur/a链接聚焦触发时失去焦点,js和html耦合在一起没有兼容性问题是a:focus {outline:none}或a{outline:none}outline由css2.1引入,去除虚线框视觉上的问题正是css的职责ie6/ie7不支持,ie8+/ff /safari/opera[2]支持否a href=”#” hide..

div+css兼容IE和firefox等浏览器方法

评论(0)浏览(166)分类:HTML/CSS兼容/XML
div+css兼容IE和firefox等浏览器方法div+css 兼容ie6 ie7 ie8 ie9和FireFox Chrome等浏览器方法1.DOCTYPE 影响 CSS 处理2.FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行3.FF: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中4.FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !imp..

IE7 xhtml模式下position:relative overflow失效

评论(0)浏览(165)分类:HTML/CSS兼容/XML
IE7 xhtml模式下position:relative overflow失效  IE7浏览器xhtml模式下,发现父容器设置了overflow:hidden/auto,子容器如果position为relative定位,父容器设置的overflow:hidden/auto失效,超出父容器的内容没有隐藏或者出现滚动条,而是直接显示出来,IE8+和其他浏览器如firefox没有问题。   IE8,显示正常IE7则内容直接显示,超出父容器范围  测试代码!DOCTYPE html PUBLIC -//..

html,dhtml,xhtml区别

评论(0)浏览(164)分类:HTML/CSS兼容/XML
html,dhtml,xhtml区别 HTML是纯粹的静态网页技术Dhtml是在静态html的基础上综合和其它动态的技术而成的网页技术;DHTML=HTML+CSS+JAVASCRIPT+DOMXHTML则是在HTML中加入了xml的规范,是HTML向XML过渡的一种技术,添加了xml的文档类型定义(DTD)和命名空间的定义,增强了html的标签;从HTML转向XHTML并不难。XHTML区别于HTML的规则如下: 1.XHTML文件的开始要声明DTD. 2..

input控件属性分隔注意不要使用全角空格

评论(0)浏览(162)分类:HTML/CSS兼容/XML
input控件属性分隔注意不要使用全角空格  checkbox/radio控件的属性之间的间隔一般是半角的空格进行分隔,如果value属性前出现了全角的空格,会导致这个控件的值为on,而不是设置的value值,测试代码如下input type=checkbox value=xx /颜色input type=radio value=0 /男input type=radio value=1 /女input type=radio value=2 /保密script var ipts = document.getElementsByT..

HTML文档DOCTYPE类型介绍

评论(0)浏览(162)分类:HTML/CSS兼容/XML
HTML文档DOCTYPE类型介绍  在HTML声明DOCTYPE有以下几种:!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/h..

第六章 WML Script标准函数库(下)

评论(0)浏览(160)分类:HTML/CSS兼容/XML
第六章 WML Script标准函数库(下)6.5 URL函数库名称:URL说明:这个函数库包含了处理绝对的URL与相对URL的程序,一般的URL语法如下:://:/;?#isValid程序:isValid(url)说明:如果给予的url值是正确的URL语法,则回传ture,否则回传false绝对与相关URL都能支持相关URL不会被转成绝对URL参数:url=字符串回传值:布尔值或invalid例外状况:无范例:var a=URL.isValid("http://ww..

Web前端开发工程师必读的15个设计博客

评论(0)浏览(158)分类:HTML/CSS兼容/XML
Web前端开发工程师必读的15个设计博客Web设计是一个不断变化的领域,因此掌握最新的发展趋势及技术动向对设计师来说非常重要,无论是学习新技术,还是寻找免费资源与工具,设计博客都是很不错的去处。本文向大家推荐15个非常不错的设计博客。 1. Smashing MagazineSmashing Magazine创建于2006年,是最好的设计博客之一,有很多Web设计和开发方面的高质量文章,内容涉及 HTML5、CSS、..

IE浏览器图片存在热点和链接时链接失效

评论(0)浏览(158)分类:HTML/CSS兼容/XML
IE浏览器图片存在热点和链接时链接失效在IE浏览器下,如果图片加了链接,并且同时需要给图片加热点的时候,链接会失效,无法点击,⊙﹏⊙b汗测试代码如下+展开-HTMLahref="//"imgsrc="//logo.jpg"border="0"usemap="#Map"/mapname="Map"id="Map"areashape="rect"coords="5,18,85,29"href="mailto:shaobo@chinabn.org"//map/aIE的bug还真多。没办法,只好用事件来解决这问题了,修改好..

html5 websocket 通信协议

评论(1)浏览(158)分类:JavaScript/Ajax开发技巧
html5 websocket 通信协议websocket通信协议实现的是基于浏览器的原生socket,在客户端用JS即可轻松完成,前些天都在学习websocket 协议(但实际上websocket 协议甚为简约),并且粗略的思考过websocket的对于下一代web应用会产生怎样的影响,我想最大的巨变应该是就是实时性上吧!另外诸如上传大文件之类的优于http的应用。但问题也随之而来,服务端怎么办?前些天我弄了..

HTML5事件属性

评论(0)浏览(158)分类:HTML/CSS兼容/XML
HTML5事件属性html5全局事件属性HTML4 增加了通过事件触发浏览器中行为的能力,比如当用户点击某个元素时启动一段 JavaScript。下面的表格列出了可插入 HTML 5 元素中以定义事件行为的标准事件属性。Window 事件属性 - Window Event Attributes表单事件 - Form Events键盘事件 - Keybord Events鼠标事件 - Mouse Events媒介事件 - Media Eventsnew:HTML 5 中..

实现div可编辑的常见方法

评论(0)浏览(157)分类:HTML/CSS兼容/XML
实现div可编辑的常见方法功能:实现网页内容的即时编辑,增加页面的可用性、交互性。方法1:直接通过textarea标签实现,请运行下边代码:+展开-HTML!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN">HTMLHEADTITLENewDocument/TITLEstyletype="text/css"#info{font-size:12px;overflow:hidden;background-color:#ffffcc;color:black;padding-right:5px;padding-..

IE对CSS样式表的限制和解决方案

评论(0)浏览(155)分类:JavaScript/Ajax开发技巧
IE对CSS样式表的限制和解决方案HTML文档与CSS的关联常见有4种方式: 1.使用link标记 +展开-HTMLlinkrel="stylesheet"type="text/css"href="sheet.css"/ 2.使用style元素+展开-HTMLstyletype="text/css"body{background:#fff;}h1{font-size:2em;}/style 3.使用@import指令+展开-HTMLstyletype="text/css"@importurl(sheet1.css);@import"sheet2.css";/style 4.使用styl..

IE alpha滤镜

评论(0)浏览(155)分类: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是一个可选参数,如果想要..

CSS在线生成网站

评论(0)浏览(155)分类:HTML/CSS兼容/XML
CSS在线生成网站  CSS代码编写是设计师的一个重要工作。写一个CSS代码和实施所需的设计任务。是非常不容易的,,今天给大家带来几个不错的工具,您可以生成在线CSS代码。节省您的时间,并自动获得一个专业的CSS代码。如果你没有css编写经验,不要紧,这几个工具正是你的所需,在线代码生成。基本上css方面的全了,像背景,布局,样式等等都包含了,哈哈CSS3.0..

IE DropShadow滤镜

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

css+div模拟frameset布局代码

评论(0)浏览(153)分类:HTML/CSS兼容/XML
css+div模拟frameset布局代码  css+div模拟frameset布局代码,frameset不利于seo,可以采用css+div的absolute定位来实现frameset布局。!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdtitlecss+div模拟frameset布局代码/titlestylebody{margin:0px}#top{height:100px;background:#eee;position:ab..

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

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

浮动层没有内容在IE下失效bug

评论(0)浏览(153)分类:HTML/CSS兼容/XML
浮动层没有内容在IE下失效bug  问题描述:在IE浏览器下,浮动层如果没有内容或者未设置过背景之类,当这个层浮动在正常内容的上面时,添加到浮动层上面的事件,如 click,mouseover等事件,当触发点在有正常内容的部分,不会响应事件,只有在没有内容的部分才会响应事件。其他浏览器如 firefox,chrome不会出现这种问题。  通过IE的开发人员工具得到下图  点击蓝色框框..

HTML5实现本地存储

评论(0)浏览(153)分类:HTML/CSS兼容/XML
HTML5实现本地存储  在HTML5本地存储之前,如果我们想在客户端保存持久化数据,有这么几个选择:   1. HTTP cookie。HTTP cookie的缺点很明显,最多只能存储4KB的数据,每个HTTP请求都会被传送回服务器,明文传输(除非你使用SSL)。  2. IE userData。userData是微软在上世纪90年代的浏览器大战时推出的本地存储方案,借助DHTML 的behaviour属性来存储本地..

DOMContentLoaded事件

评论(0)浏览(152)分类:JavaScript/Ajax开发技巧
DOMContentLoaded事件  DOMContentLoaded事件是在DOM已经准备好,而其他资源可能还未下载完毕时触发的,可以藉此尽快的给各种交互用的dom绑定交互事件  备注:IE6~8不支持此事件,需要模拟。  目前,在IE中模拟DOMContentLoaded事件有3种方法。document.attachEvent(onreadystatechange, function(){ if ( document.readyState === complete ) { do..

HTML技巧(二)

评论(0)浏览(152)分类:HTML/CSS兼容/XML
HTML技巧(二) HTML技巧(二)ps:部分已失效 31. 如何知道我的站点连接出现的地方?可能你的站点被其它站点连接,如何知道呢,访问搜索引擎站点:http://www.altavista.digital.com/在搜索窗口中,输入:+link:yoursite.com-host:yoursite.com这样,包含你站点连接的页面被列出,当然,你也可能什么都没有找到。32. 如何避免自己的图片被其它站点利用?为图片起..

head区的其他设置

评论(0)浏览(151)分类:HTML/CSS兼容/XML
head区的其他设置这些技巧主要讲meta标签设置的,其实与符合web标准关系不大,只要注意在最后加"/"关闭标签就可以,但是既然是入门教程,就写得详细一点吧。收藏夹小图标如果你将本站加入收藏夹,可以看到在收藏夹网址之前的IE图标变成了本站特别的图标。要实现这样效果很简单,首先制作一个16x16的icon图标,命名为favicon.ico,放在根目录下。然后将下面的代码..

Firefox上传文件获取全路径问题

评论(0)浏览(151)分类:JavaScript/Ajax开发技巧
Firefox上传文件获取全路径问题firefox上传文件时只能获取图片的文件名不能获取全路径,因此不能预览,怎么解决呢? ===========  firefox,ie7,ie8都是不能直接访问本地文件的。比如+展开-HTMLimgsrc="C:\DocumentsandSettings\Administrator.WWW-00E83A94D30\MyDocuments\MyPictures\winter.jpg"/会给你显示一个X,只有IE6下才有这个权限可以访问,高版本的浏览器出于安全考..

IE glow滤镜

评论(0)浏览(151)分类: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} ..

firefox如何设置动态图标和网站图标favicon.ico

评论(0)浏览(150)分类:HTML/CSS兼容/XML
firefox如何设置动态图标和网站图标favicon.ico  Favicon,即Favorites Icon,它可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。在主流浏览器如FireFox和Internet Explorer (5.5及以上版本)中,favicon不仅在收藏夹中显示,还会出现在地址栏上,这时用户可以拖曳地址前面的favicon图标到桌面以建立到该网站的 快捷方式。另外,标签式浏览器还有不少扩展功能,如..