最新日志 »

条件注释的一点小理解---[if ! IE]»

» 2010-1-28
» web标准

Hack中的条件注释

1. <!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->
2. <!--[if IE]> 所有的IE可识别 <![endif]-->
3. <!--[if IE 5.0]> 只有IE5.0可以识别 <![endif]-->
4. <!--[if IE 5]> 仅IE5.0与IE5.5可以识别 <![endif]-->
5. <!--[if gt IE 5.0]> IE5.0以及IE5.0以上版本都可以识别 <![endif]-->
6. <!--[if IE 6]> 仅IE6可识别 <![endif]-->
7. <!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
8. <!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
9. <!--[if IE 7]> 仅IE7可识别 <![endif]-->
10. <!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->
11. <!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->

其中第一个非IE的情况,我犯了好几回错误.不过后来在DW中发现:
按此在新窗口浏览图片
这个似乎说明:!IE游览器对条件注释成灰色不解释
所以偶觉得:如果非IE中要条件注释只要注释后,让条件里的信息不成灰色就行了.
所以

<!--[if !IE]>
<!-->
<link href="css.css" rel="stylesheet" type="text/css" />
<!-->
<![endif]-->

从一本书上看到,非IE也可以是这样
<![if !IE]>
<link href="css.css" rel="stylesheet" type="text/css" />
<![endif]-->

这个在DW上看也不是灰色的.不过与上面的有些不同,这个包括<![if !IE]>这个注释结点也不是灰色的.

以上只是自己的理解..- -!!

Comments(0)

网页head标签里的一些知识»

» 2010-1-2
» 其它

以下是QQ空间页面的引用

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn" lang="zh-cn" xmlns:qz="http://qzone.qq.com/">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Language" content="utf-8"/>
<meta name="author" content="ㄑ可乐ㄑㄑ"/>
<meta name="Copyright" content="Tencent"/>
<meta name="Description" content="...."/>
<meta name="Keywords" content="丶.8o23.乐,ㄑ可乐ㄑㄑ,Qzone,QQ空间,Blog,博客,网络日志,播客,腾讯,QQ,Tencent"/>
<meta name="robots" content="all"/>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
<title>丶.8o23.乐 [http://312709349.qzone.qq.com]</title>
<script type="text/javascript">document.domain="qq.com";var _s_=new Date();</script>
<base href="http://cnc.imgcache.qq.com/"></base>
<link rel="alternate" type="application/rss+xml" title="RSS news feed" href="http://feeds.qzone.qq.com/cgi-bin/cgi_rss_out?uin=312709349"/>
<link rel="Shortcut Icon" href="http://cnc.imgcache.qq.com/qzonestyle/qzone_client_v5/img/favicon.ico" type="image/x-icon"/>
<link rel="archives" title="丶.8o23.乐" href="http://b.cnc.qzone.qq.com/cgi-bin/blognew/simpleqzone_blog_title?hostuin=312709349"/>

head标签里的Meta和link了几个不知道.一个一个看:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

这个是定义当前文档的编码和类型,utf-8和text/html
<meta http-equiv="Content-Language" content="utf-8"/>

这个是定义当前内容的语言.
<meta name="author" content="ㄑ可乐ㄑㄑ"/>

网页的author(作者)
<meta name="Copyright" content="Tencent"/>

网页的Copyright(版权)
<meta name="Description" content="...."/>

网页内容的简短说明,这个从SEO上看文字最好控制在100左右
<meta name="Keywords" content="丶.8o23.乐,ㄑ可乐ㄑㄑ,Qzone,QQ空间,Blog,博客,网络日志,播客,腾讯,QQ,Tencent"/>

网页的关键字
<meta name="robots" content="all"/>

- 定义网页搜索引擎索引方式
此处的all是指搜索引擎将索引此网页与继续通过此网页的链接索引
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>

解决IE8的问题,让IE8以IE7模式游览
<link rel="alternate" type="application/rss+xml" title="RSS news feed" href="http://feeds.qzone.qq.com/cgi-bin/cgi_rss_out?uin=312709349"/>

Rss订阅.可以使网页获取XML.
<link rel="archives" title="丶.8o23.乐" href="http://b.cnc.qzone.qq.com/cgi-bin/blognew/simpleqzone_blog_title?hostuin=312709349"/>

网页的归档信息

另外还有一些不常见到的

<meta http-equiv="MSThemeCompatible" Content="Yes" />

--:是否在IE中 开/关系统的主题
<meta http-equiv="Content-Script-Type" Content="text/javascript" />

指明页面中脚本的类型
<meta http-equiv="Refresh" Content="5; Url=http://www.14pc.com/" />

让网页在多少秒后刷新自己或转到的页面
<meta name="google-site-verification" content="fAqQluW4K2gCz2kY9R2LkkVbBeNvSZsOiuzRLEo9H10" />

google验证网页时用到的
<meta name="date" content="2010-01-01T20:50:30+00:00" />

定义网页的的生成时间,格式为GMT

Comments(2)

让IE也支持HTMLElement»

» 2009-12-9
» 读书笔记

今天看<精通JavaScritp>PDF电子书DOM的一章,其中讲了很多查找结点,操作结点的方法,刚开始是几个查找结点的方法,前一个结点,后一个结点,第一个子结点,最后一个子结点.父级结点;分别是

//前一个结点
function prev(elem){
do{
elem=elem.previousSibling;
}while(elem && elem.nodeType!=1);
return elem;
}
//后一个结点
function next(elem){
do{
elem=elem.nextSibling;
}while(elem && elem.nodeType!=1);
return elem;
}
//第一个子结点
function first(elem){
do{
elem=elem.firstChild;
}while(elem && elem.nodeType!=1);
return elem;
}
//父级元素结点
function parent(elem,num){
num=num || 1;
for(var i=0;i<num;i++){
if(elem!=null)
elem=elem.parentNode;
return elem;
}
}

例子


不过这样的代码并不优美.
在FF和Opera中存在一个强大的对象原型叫做HTMLElement,它允许你为每一个HTMLDOM元素绑定函数和数据.
<script type="text/javascript">
HTMLElement.prototype.next=function(){
var elem=this;
do{
elem=elem.nextSibling;
}while(elem && elem.nodeType!=1);
return elem;}
alert(document.getElementsByTagName('div')[0].next().nodeName);
</script>

不过IE并不支持它.所以自己得创造;
设置一个dom的方法
copycode:
var domMethod = {
//设置扩展dom的方法
extendDom: function(name,fn){

if(!document.all){ //除了ie而外的浏览器都能够访问到HTMLElement这个类
HTMLElement.prototype[name] = fn;
}else{
var _createElement = document.createElement;
document.createElement = function(tag){
var elem = _createElement(tag);
elem[name] = fn;
return elem;
}
var _getElementById = document.getElementById;
document.getElementById = function(id){
var elem = _getElementById(id);
elem[name] = fn;
return elem;
}
var _getElementsByTagName = document.getElementsByTagName;
document.getElementsByTagName = function(tag){
var arr = _getElementsByTagName(tag);
for(var i=0;i<arr.length;i++){
arr[i][name] = fn;
}
return arr;
}
}
}
}


例子说话

Comments(1)

专门IE6中png的透明(滤镜方法)»

» 2009-11-29
» web标准

前几天在做一个项目时.原来的logo是png格式,body的背景是水平平铺的渐变效果.在IE6中.logo处在土灰色中.因为IE6中不支持它.当时的做法.再做了一个gif的(gif效果质量有点不好)
专门针对IE6.在页面结构logo的地方加上一段JS:
var isie6 = window.XMLHttpRequest ? false: true;
if (document.getElementsByTagName("h1"))
document.getElementsByTagName('h1')[0].getElementsByTagName('img')[0].src = (isie6) ? 'imageStyle/logo.gif': 'imageStyle/logo.png';

我知道有点欺骗感觉.不过今天在看新浪围脖的html结构时发现这一段
CSS:
.bigName .logo {
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='http://simg.sinajs.cn/miniblog/images/common/logo.png'); _background-image: none; }

html:
<div class="bigName">
<h1 class="logo"><a href="javascript:;" id="id1"></a></div>

.看过之后我才明白IE6下PNG的透明原来是这样的.呼呼.学习哉!
方法也是用JS判断IE的版.如果IE6的话.用CSS中background属性显示logo.当然,如果这个logo还有链接的话.还要对这空的a标签进行block设置,而如果非IE6.那么就在这个a标签里写入一个img(不管你是appendChild还是innerHTML).
例子:


推荐阅读最佳IE6环境下实现PNG-24的应用方案

Comments(0)

备案终于成功了»

» 2009-11-26
» 其它

备案终于成功了.编号在网站下面.呼呼~~
从10月14号到现在真是一个漫长的等待呀.
网站又添加一个几个导航,一个是围脖,一个是我的QQ空间(都是些生活上的日记,琐碎),还有一个简陋的搜索功能,呼呼~先做这么多,这段时间工作也很忙.看书的速度也很慢.
月初在旧书市场花了20块买了本<ppk on javascript>
按此在新窗口浏览图片
还在拜读中.计划是月底前很看两遍.不过今天才发现.一遍也可能看不完.不是看不懂而是没时间,所以要挤了.
网站又启动了.飞起来吧.

Comments(0)