Azuresky Blog

CSS网页设计解决方案(Hacks Issues)

Fri, 13 Jun 2008 21:20:13 +0800

    1、说明本文阐述了8条我们发现的在用CSS设计中有用的解决方案。

    2、浏览器特定的选择器

    英文地址：  http://www.solidstategroup.com/page/1592

    当你想在一个浏览器里改变样式而不像在其他浏览器中改变时，这些选择器很有用。

    IE6以下

   *html{}

    IE 7 以下

*:first-child+html {} * html {}

    只对IE 7

*:first-child+html {}

    只对IE 7 和现代浏览器

html>body {}

    只对现代浏览器(非IE 7)

html>/**/body {}

    最新的Opera 9以下版本

html:first-child {}

Safari

html[xmlns*=”"] body:last-child {}

    要使用这些选择器，请在样式前写下这些代码。例如：

#content-box {
　　width: 300px;
　　height: 150px;
}
* html #content-box {
　　width: 250px;
}
/* 重写上面的代码并且把宽度改为250px
在IE6以下版本中适用。 */

    3、在IE6中使用透明PNG图片

    IE6的一个很难处理的BUG就是它不支持透明PNG图片。

    你可能需要用一个重写的CSS的滤镜来解决这个问题：

*html #image-style {
　　background-image: none;
　　filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”filename.png”, sizingMethod=”scale”);
}

    4、去掉连接虚线框

    当你点击链接时，Firefox会在链接周围产生一个虚线外框。
　　
点击在新窗口中浏览此图片
http://www.azuresky.com.cn/attachment.php?fid=139

    这个很好解决，只需在a标签中添加outline:none就可以了。

a{
　　outline:none;
}

    5、对inline元素应用宽度。

    如果你对一个inline元素使用宽度，它将只在IE6下起作用。

    所以的HTML标签要么是Block的要么就是inline的。inline属性的标签有<span><a>< strong>和<em>Block标签包括<div><p><h1><form> 和<li>

    你不能控制inilne标签的宽带，不过有一个方法是把标签属性从inline改为Block。

span{
　　width:150px;
　　display:block;
}

    应用display:block能够把span标签变成block标签，从而控制它的宽度。

    6、使一个固定宽度的网站居中。

    为了让你的网站在浏览器中居中，可以为最外层Div添加position:relative属性，然后将margin设为auto。

#wrapper {
　　margin: auto;
　　position: relative;
}

    7、图片替换技术

    对于头部来说，永远是最好用文字而不是图片。在你必须要用图片的某个特殊地方最好使用隐藏文字的层的背景图片。这对于屏幕阅读和SEO非常有用，尽管依然使用很普通的文字，这可以联想到所有的优点。

HTML：

<h1><span>Main heading one</span></h1>

CSS:

h1 {
　　background: url(heading-image.gif) no-repeat;
}
h1 span {
　　position:absolute;
　　text-indent: -5000px;
}

    正如你所见，我们对H1标签使用普通的HTML代码，用CSS来将图片替代文字。Text-indent把文字放到左边5000像素处，从而用户看不到它们

    8、最小宽度

    IE的另外一个Bug就是它不支持min-width属性。min-width确实非常有用，特别是对于100%宽度的可变模板来说，因为他告诉浏览器停止收缩。

    对于除IE6以外的所有浏览器来说你只需min-width:xpx;例如：

.container {
　　min-width:300px;
}

    要让这些在IE6下起作用的话你要添加额外的努力！你需要创建两个DIV，一个包含着另一个。

<div class=”container”>
<div class=”holder”>Content</div>
</div>

    然后你需要设置外面层的min-width：

.container {
　　min-width:300px;
}

    现在又要IE hack起作用了，你需要写下以下代码：

* html .container {
　　border-right: 300px solid #FFF;
}
* html .holder {
　　display: inline-block;
　　position: relative;
　　margin-right: -300px;
}

    当浏览器窗口调整外层宽度来适应直到它缩小到border的宽度时，这个时候它就不能够在缩小了。而holder层也会停止收缩。外层的边框宽度变成了内层的最小宽度。

    9、隐藏水平滚动

    要去除水平滚动条，可以在body中插入overflow-x:hidden属性。

body {
　　overflow-x: hidden;
}

    这在你决意要用一个比浏览器款的图片或Flash时很有用。
Tags - css , css滤镜 , div , code , 解决方案

较常用的CSS层叠样式表缩写总汇

Fri, 13 Jun 2008 20:42:34 +0800

善用CSS层叠样式表缩写可以有效地把CSS文件的大小减小。

CSS缩写的主要规则如下：

颜色(color)
16进制的色彩值，如果每两位的值相同，可以缩写一半，例如：
#000000可以缩写为#000;#336699可以缩写为#369;

容器填充(padding)与边距(margin)
通常有下面四种书写方法:
    property:value1; 表示所有边都是一个值value1；
    property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2
    property:value1 value2 value3; 表示top的值是value1，right和left的值是value2，bottom的值是value3
    property:value1 value2 value3 value4; 四个值依次表示top,right,bottom,left

方便的记忆方法是顺时针，上右下左。具体应用在margin和padding的例子如下：

引用

margin:5px;
margin:5px 6px;
margin:5px 6px 4px;
margin:5px 6px 4px 6px;

边框(border)
边框的属性如下：

引用

    border-width:1px;
    border-style:solid;
    border-color:#000;

可以缩写为一句：

引用

border:1px solid #000;

语法是border:width style color;

背景(backgrounds)
背景的属性如下：

引用

    background-color:#f00;
    background-image:url(background.gif);
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:0 0;

可以缩写为一句：

引用

background:#f00 url(background.gif) no-repeat fixed 0 0;

语法是background:color image repeat attachment position;

你可以省略其中一个或多个属性值，如果省略，该属性值将用浏览器默认值，默认值为：
    color: transparent
    image: none
    repeat: repeat
    attachment: scroll
    position: 0% 0%

字体(fonts)
字体的属性如下：

引用

    font-style:italic;
    font-variant:small-caps;
    font-weight:bold;
    font-size:1em;
    line-height:140%;
    font-family:"Lucida Grande",sans-serif;

可以缩写为一句：

引用

font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;

注意，如果你缩写字体定义，至少要定义font-size和font-family两个值。

列表(lists)
取消默认的圆点和序号可以这样写list-style:none;
list的属性如下:

引用

    list-style-type:square;
    list-style-position:inside;
    list-style-image:url(image.gif);

可以缩写为一句：

引用

list-style:square inside url(image.gif);

Tags - css , code , css缩写

Mozilla给网站制作朋友们的CSS书写顺序建议

Fri, 13 Jun 2008 20:22:30 +0800

css显示样式定义属性
display
list-style
position
float
clear

css容器、块等自身样式定义属性
width
height
margin
padding
border
background

css文本样式定义属性
color
font
text-decoration
text-align
vertical-align
white-space
other text
content
Tags - div , css , mozilla

Tue, 20 May 2008 21:10:44 +0800

黑灰白网页，为全国哀悼日改网页样式为黑灰白色方法-CSS滤镜Gray

Mon, 19 May 2008 22:35:51 +0800

2008年05月19日，绝大部分大型门户网站、百度、腾讯、网易、雅虎等等都把网站、网页改成了黑白灰色的样式
以示深切哀悼的心情。

这里我教大家用CSS滤镜就能不用进行特大的工程来改变风格样式达到黑白灰色网站效果。
............

Tags - 全国哀悼日 , 2008.05.19 , css , css滤镜 , code

2008年05月19-21日全国哀悼日，为四川汶川默哀3分钟

Mon, 19 May 2008 22:14:45 +0800

2008年05月19日14时28分起，全国人民为四川汶川大地震遇难者默哀3分钟。
各地汽车、火车、舰船笛声长鸣，防空警报在各城市上空鸣响。
并将05月19-21日定为全国哀悼日。

我也将我的个人网站“蔚蓝色天空”、“Azuresky Blog”黑灰白色三天，以表默哀之心。
历史将记住让人们沉痛受苦的这些日子
............

Tags - 四川汶川 , 7.8级地震 , 2008.05.19 , 全国哀悼日 , 救灾

中国雅虎、百度、谷歌的四川汶川救灾最新消息，雅虎还有捐款的通道

Fri, 16 May 2008 21:23:55 +0800

Yahoo(中国雅虎)提供的四川汶川救灾最新消息，也有捐款的通道
详情点击下面图片！有救灾的最新情况
里面有捐款通道，都靠自愿吧...

百度的赈灾图片也放出来，包含链向百度赈灾的专区

Google（谷歌）设的“寻找灾区的亲人”搜索专区：

Tags - 四川汶川 , 7.8级地震 , 救灾 , yahoo , googlebaidu

震碎蜀地,流亡...向天...无力...

Wed, 14 May 2008 23:43:33 +0800

2008-05-12日，一个令人感到无法表达的事情发生了
四川汶川发生7.8级的强烈地震，面对死亡，有太多的不可预测。

看那些新闻图片，全身会颤抖，不想放上来，也不知道要说些什么。

......

让我们为四川地震灾区的人们默哀祈福一分钟...
Tags - 四川汶川 , 7.8级地震

十种用JavaScript处理图片的特别效果

Wed, 14 May 2008 12:45:38 +0800

10种用JavaScript来进行处理图片的特别效果
前段时间网络上暇逛，在“可能吧”看到一篇“10个用能用JavaScript实现的图片特效”
然后连接到国外的一个叫Blog Oh Blog原文上。
感觉非常有趣，不需要Photoshop来进行处理，图片本身还是原来的图片
用JavaScript来自动对页面上的图片在原来的基础上处理显示出的特别效果
有需要玩玩可以体验下。

1、图片倒影效果（Reflex.js）
这个脚本能使图片产生倒影的效果。效果如下：

引用

下载地址（官方提供）：Reflex.zip

2、图片边角卷叶效果（Curl.js）
这个JavaScript能使图片产生卷页的效果，而且鼠标悬停时可以添加动态卷页效果。效果如下：

引用

下载地址（官方提供）：Curl.zip

3、图片花边效果（Edge.js）
这个脚本能使图片的边缘产生花边和模糊效果，。效果如下：

引用

下载地址（官方提供）：Edge.zip

4、图片圆角、阴影效果（Corner.js）
这个JavaScript能使图片的边角成为圆角并且整个图片有阴影效果。效果如下：

引用

下载地址（官方提供）：Corner.zip

5、图片幻灯片框架效果（Slided.js）
这个脚本能使图片的周边产生幻灯片的框架效果。效果如下：

引用

下载地址（官方提供）：Slided.zip

6、图片高光立体按钮效果（Glossy.js）
这个脚本能使图片产生立体的光泽效果，犹如水晶按钮般，还会产生阴影。效果如下：

引用

下载地址（官方提供）：Glossy.zip

7、图片电影胶片效果（Filmed.js）
这个脚本能使图片产生犹如电影胶片的效果，还能调整阴影立体感。效果如下：

引用

下载地址（官方提供）：Filmed.zip

8、图片内部放大镜效果（Loupe.js）
这个脚本能使图片的内部生成一个放大镜，能让浏览者拖动放大镜放大查看图片的效果。效果如下：

引用

下载地址（官方提供）：Loupe.zip

9、图片边框与阴影效果（Instant.js）
这个JavaScript能使图片产生犹如照片的边框效果效果。效果如下：

引用

下载地址（官方提供）：Instant.zip

10、图片斜光立体效果（Bevel.js）
这个脚本能使图片产生立体的效果，犹如水晶按钮般，还会产生阴影
跟Glossy.js差不错，但立体程度与光泽有所区别。效果如下：

引用

下载地址（官方提供）：Bevel.zip

应用以上图片效果在网页方法：

下载解压后上传到空间，然后在需要显示效果的页面内head标签里添加入以下代码（示范倒影效果reflex.js）：

然后，在想要显示图片处理特效的图片img标签里添里加入class类参数，例如：

更详细可到官方网站查看。本身下载回来的文件里面也有详细用法介绍

然后，加上该class的图片就会有倒影的效果了。

其它图片处理特效添加方法相同。
Tags - javascript , 特效 , code

Azuresky Blog悄悄地Google PageRank为2

Wed, 30 Apr 2008 22:10:39 +0800

Google神不知鬼不觉的把握的Blog的PR值更新为2了。
因为与2008年4月24日找到并开始工作，所以都在忙。
也估计没太多时间来更新Blog了，反正有时间就更新Blog。
愿它成为常青树，可是我没时间更新，很难成为常青树吧？？
革命尚未成功，Tim我还得继续努力。

Google PR值2与其他搜索引擎收录情况截图。

Tags - google , pagerank

每个人都有傻瓜般的一面

Fri, 18 Apr 2008 22:01:54 +0800

最近都在听吴克群的新专辑《为你写诗》，很好听！
最先听到他的歌是在“我猜“上吴克群在节目上宣传为一个上节目的女生所唱。
后来就把他整个《为你写诗》听了。
现在我听歌的习惯是听一个歌手的整个专辑。
新歌或以前的歌大都一张一张专辑的听，部分的单曲和国外歌曲除外！
感觉这样才能”听到“”了解“那位歌手的创作过程及背后的故事。

我大概清楚我为什么想要写下这张专辑的文章！希望一部分人看到了这篇文听听这张专辑。

从专辑中甚至他的新浪Blog中可以看到，他是一位为人很真并且很有心的歌手。
猜测，吴克群老大以前和现在都是一位对爱情很傻很深情并且感性的人（听了他专辑，看了他blog后猜测）。

引用

　　为你写诗
　　在爱情里每个人都是傻子，以[小星星]为开端，慢慢酝酿，2008最千载难逢的真爱情歌。

　　牵牵牵手
　　简单的小动作却能够传达很多温柔，吴克群傻气深情的演唱，温暖旋律轻敲心底。

　　情人节
　　继[男佣][大舌头]后来一首情人节，俏皮有趣，让人每天都想过情人节。

　　什么东西（也叫”喂“）
　　舞曲、摇滚的玩美结合，听一遍就中了魔咒，忍不住跟着唱起[什么东西]！

　　越爱越难过
　　一辈子都忘不了的挚爱，一辈子藏在心里的春季恋歌，跟着情绪推进的节奏，一层一层加深心痛，越爱越难过。

　　音乐让我说
　　轻松俏皮的活泼小品，散发开心的音乐频率。担心初遇的害羞尴尬？没关系，吴克群用音乐帮你说！

　　我不管
　　无论别人怎么说，淋漓畅快的摇滚曲风，吴克群用力唱出不畏流言蜚语的勇气。

　　动
　　世界掌握在有信心的人手中，强悍的旋律，霸气的编曲，音乐犹如引擎，加速马力催到底，吴克群训练你的听觉极速！

　　我的自传
　　长达六分钟的半念半唱，唱出当歌手的高低起伏！

　　眼睛不闭着
　　简单的旋律，简单的心情，藏在歌曲背后的故事让音乐更加动人，吴克群写给癌症歌迷的一首希望。

此处包含一个多媒体文件，请用网页方式查看。

吴克群-为你写诗
作词:吴克群作曲:吴克群

爱情是一种怪事
我开始全身不受控制
爱情是一种本事
我开始连自己都不是
为你我做了太多的傻事
第一件就是为你写诗

为你写诗为你静止
为你做不可能的事
为你我学会弹琴写词
为你失去理智

为你写诗为你静止
为你做不可能的事
为你弹奏所有情歌的句子
我忘了说
最美的是你的名字

我什么都能忘记
但唯一不忘的是你的名字
我什么都能忘记
但唯一不忘的是你的样子
我什么都能忘记
但唯一不忘的是你的名字
我什么都能忘记
但唯一不忘的是你的样子

是的如里面的歌里面的主角，每个人都有傻瓜的一面

Tags - 为你写诗 , 吴克群 , 傻瓜

提供“我爱中国”与“中国心”头像

Fri, 18 Apr 2008 14:59:44 +0800

我没“anti-cnn”上的一些朋友那么“愤青”，但我是爱国的。I Love China
什么都不想说！
对用不用这两个头像的人，我很能理解，的确是不一定要把QQ和MSN换成这个头像！
但是对于一些麻木的人，说想叫他换这个两个头像是傻瓜的人，换这个头像是傻了的人。
我为你们感到悲哀，换不换是你的权利，可是不要讽刺换了这个头像的人。
我真的怀疑，是不是你到了出去国外被人讥笑、到了“三战”你才会觉悟？？？

现在似乎网络上找到的头像都是比较不清晰的头像！
要么还出现红心中间有黑色半透明条纹的“盗版”中国心头像（笑）。
............

Tags - 中国心 , 我爱中国

奥运临近达赖起兴国外论评(解析做人不能太CNN)

Fri, 18 Apr 2008 13:15:12 +0800

最近发生很多事情，不得不说说。

奥运临近
　　2008-08-08
　　我国北京将迎来世界最热闹的 - 奥运会(Olympic Games)

引用

　　奥林匹克运动会简称奥运会，它包括夏奥会，冬奥会，残奥会,青奥会和特奥会。是国际奥林匹克委员会主办的包含多种体育运动项目的国际性运动会，每四年举行一次。奥林匹克运动会最早起源于古希腊（公元前776年），因举办地在奥林匹亚而得名。19世纪末由法国的顾拜旦男爵创立了真正意义上的现代奥林匹克运动会。从1896年开始奥林匹克运动会每四年举办一次（曾在两次世界大战中中断过三次，分别是在公元1916、1940和1944年），会期不超过16天。由于 1924年开始设立了冬季奥林匹克运动会，因此奥林匹克运动会习惯上又称为“夏季奥林匹克运动会”。
奥林匹克运动会现在已经成为了和平与友谊的象征。奥运的精神是世代相传的，永不停息的。

达赖起兴
　　这是在奥运会临近发生的事。
　　今年3月14日，拉萨市区发生了打砸抢烧严重暴力犯罪事件。
　　这是由达赖集团有组织、有预谋、精心策划煽动，境内外“藏独”分裂势力相互勾结制造的。

国外论评
　　一些国外媒体对西藏拉萨发生打砸抢烧的严重暴力事件给与了“焦点”的关注
　　而且对其进行夸大"失实"的报道
　
　　3月27日,在外交部例行的新闻发布会上
　　有国外媒体提问:这个网站是否得到中国政府的支持.
　　外交部新闻发言人秦刚回应说:
　　你提到的这个事情反应了一个社会现象,值得在座的媒体进行反思和思考。
　　你问是不是有政府的成分在里面,你们应该看一看有的西方媒体的报道，
　　这种现象难道还用中国政府去煽动么吗？
　　这完全是中国各界群众对这种不负责任违反职业道德的报道予以自发的谴责和批判。

　　CNN是美国著名的新闻媒体,一直强调要以客观公正的态度报道新闻。
　　但是在报道拉萨的暴力事件中,却出现了大量失实报道。

断章取义简介

CNN断章取义之图
图中两辆军车整朝两名平民驶来,事实上如果完整的把那幅图片展示出来
可以看到但是军车旁有约10名暴徒朝军车投石头.
显然CNN网站"断章取义"之图,故意剪切掉了暴徒故意向军车投石头的部分.

BBC网站刊登题为:藏人描述持续骚乱
的报道,所配照片如下：

说明是:拉萨有大量军队。
而事实上,配图是当地公安人员协助医护人员将骚乱受伤人员送进救护车的情景.
切看途中的"急救"二字,就算是老外不知道中文,那么救护车后面大大的"红十字"不该看不到吧?
真的是,太烂,太不专业了.

德国RTL电视台网站的新闻栏目,一副四名警察拿着木棒追着游行者的图片.

图片说明:中国警察在镇压抗议者
但这副图片实际上,是尼泊尔警察3月17日在加德满都驱散游行示威者。

同样的把戏，出现在德国n-tv电视台的节目中。

德国画报，3月28日的无耻截图：

图片注释:西藏局势升级
标题是:应该抵制奥运会吗?

尼泊尔警察-中国警察　对照

这些报道引发了众多中国网民国外华侨的抗议
一些网民还建立了一个"反CNN"网站
本文图片来自于网络上（anti-cnn.com）。
如想知道更多此次事件，与国外媒体的“焦点”关注的漏洞
请大家到http://www.anti-cnn.com “anti CNN（反CNN）”网去看看吧
并开设有论坛供讨论。还有反BBC与反VOA(这两个似乎没有开放)

最后引用下“反CNN”网站的口号：

引用

我们并不反对媒体本身，我们只反对媒体的不客观报道。
我们并不反对西方人民，但是我们反对偏见。

还请大家做人不要太CNN了。
你了解没?

Tags - 反cnn , 西藏拉萨 , 达赖

Photoshop Express已经开始公测

Thu, 03 Apr 2008 12:55:54 +0800

刚刚得知
Adobe公司于2008-03-29宣布，在线版PS程序“Photoshop Express”已经开放公测。

Photoshop Express免费提供2GB空间，用户可以在线存储、管理、编辑、分享自己的照片，并能通过Facebook等社交网站进行上传和下载，或者在Adobe提供的画廊里互相展示。

感兴趣的朋友可以到：http://www.photoshop.com/express
注册自己的帐号！
感慨，虽然现今Photoshop Express与专业Photoshop功能差别很大。
但，全新的Web时代Photoshop从此到来。
Tags - adobe , photoshop , 历史见证

对整个Blog的文章进行了SEO

Wed, 02 Apr 2008 17:24:00 +0800

针对整个Blog进行了SEO！
完毕后有些后悔！因为在搜索引擎搜索我的blog。所有文章点击后无法显示了（SEO文章的url）。

应该每天两三篇的进行SEO才好！大规模的SEO，太多的404页面！怕被Google和百度给K掉了。

也对robots.txt文件进行了修改！希望能起到屏蔽优化前的全部文章收录。

期待，期待无事的度过这一时期。如果真的被搜索引擎K掉，也只好以后再去搜索引擎登录了。

Flash视频全屏播放的ActionScript

Tue, 01 Apr 2008 21:50:52 +0800

最近在深入学习Flash中！
在看56或者土豆的视频的时候。有一个全屏幕播放视频的按钮。

想要通过点击一个按钮然后全屏播放你的Flash，那么就需要用到ActionScript 2.0的一个语句来实现。
很简单，只需在Flash需要点击的按钮中加入以下ActionScript语句：
全屏播放:

on (release) {
　　Stage.displayState = "fullScreen";

退出全屏播放:

on (release) {
　　Stage.displayState = "normal";
}

鼠标响应事件随便你选择点击或者鼠标滑过等等

然后还需要在网页插入Flash的参数中加入下面这段：

启用全屏设置为"true"，否则设置为"false"（默认值）
这是当在响应鼠标事件或键盘事件时才会调用启动Flash全屏模式的ActionScript。
值得注意的是，在全屏模式下，无法在Flash文本框输入文本。

Tags - flash , code , actionscript

Flash网页在浏览器中全屏显示的详细方法

Mon, 31 Mar 2008 20:17:34 +0800

最近一段时间都在做毕业设计和帮忙制作“Ｐ＆Ｄ品多卫浴”的产品展示网站。
都没有时间写写东西了。
不过在制作毕业设计和“Ｐ＆Ｄ品多卫浴”这个网站的时候。
需要用到有单独Flash页面在浏览器中全屏显示。

最简单的方法就是：
先用Dreamweaver直接插入Flash。然后把里面的参数属性width和height设置成：width="100%" height="100%"

部分代码：

如果现在在浏览器查看效果，可能不是在浏览器中以全屏幕的显示方式浏览Flash。
因为还需要写几个CSS的样式定义。
因此我在head标签中写入一下CSS：

这是为了让html与body标签内的内容以浏览器100%全屏幕的方式显示，而#flashContent则是我插入Flash的那个层的id。
好了，现在在浏览器中浏览，发现是以全屏模式浏览Flash了

切记的是，插入的Flash不要加上salign这个参数

它将会以上、下左右等等对齐的方式显示Flash

为了插入通过XHTML 1.0的验证。不想你网页上的Flash有“单击以激活并使用此控件”框，可采用SWFObject的方法插入Flash（有关SWFObject的资料去看这里）。
用SWFObject插入在浏览器中全屏显示Flash的方法也是设置宽与高为100%

Tags - flash , code

把Azuresky BLOG换回我自己最初的风格

Sat, 22 Mar 2008 11:32:50 +0800

由于审美观还是以简洁清新为主。
所以昨天把风格恢复到TTFlying，待以后制作出符合我自己的Style后再进行更换。
相信不会很久，等有空了，就开始制作新的Template。

博客SEO必知：搜索引擎Ping服务的一些地址

Fri, 21 Mar 2008 15:24:44 +0800

Ping服务
Ping 服务是一种通知“博客搜索引擎”某一博客内容已经更新的通知服务。
当blog作者在发表更新文章时，这些更新将通知搜索引擎
使搜索引擎能及时以最快的时间内收录更新你Blog的文章。
以上能体现Ping服务对SEO的重要性。

Ping服务分
　- 手动Ping服务
　- 自动Ping服务

手动Ping服务
当发布或更新你的Blog文章后
在博客搜索引擎提供的手动Ping服务页面提交一次Blog的地址或Blog的RSS地址即可。

自动Ping服务
以博客搜索引擎提供的Ping Server API将Blog内容的更新通知给搜索引擎
无需每次更新Blog后都手动进行更新通知，这对于经常更新Blog内容的用户尤其有用。

......
............

Tags - seo

Apple(苹果)官方已经放出Safari 3.1 正式版下载

Thu, 20 Mar 2008 19:28:16 +0800

Apple官方网放出了Safari 3.1 正式版本的下载

Safari 3.1
支持新一代的因特网视频、音频、与动画标准，能够提供尽可能最佳的Web 2.0浏览体验。
并支持全部范围普及的互联网插件-包括Flash、Shockwave和QuickTime（CSS3 Web字体支持、CSS动画支持、HTML 5的媒体支持等...）
............

Tags - apple , safari

经典Logo改造成Web2.0样式

Thu, 20 Mar 2008 17:46:50 +0800

Web2.0样式风行，现在不知道哪位朋友把一些品牌的经典Logo改造成Web2.0样式！
这些图片好像是一年前左右的了！现在贴出来欣赏欣赏！

............

Tags - 经典

横空出世IE 8.0 Beta1安装与新体验

Tue, 11 Mar 2008 16:39:41 +0800

IE7还没有普及，现在微软又继续推出了IE 8.0 Beta1来刺激用户！
这些年浏览器这块版，被分成4份。

有微软的代表IE（Internet Explorer）
还有“热火朝天”的FF（Firefox）
从手机平台发展到Windows平台的Opera
还有来势汹汹的Apple Safari。

当然其中最火热的还属IE与FF之间的战争！
Firefox 3 已经到了Beta 3了；微软也不甘心落后，现在推出了IE 8.0 Beta1决心与之抗衡。誓把遗失之地争取回来？
............

Tags - microsoft

两个课程期末设计的窗体界面

Thu, 06 Mar 2008 22:11:09 +0800

............

Tags - design , 设计

Adobe Photoshop历代启动界面回顾(截至07年的CS3)

Wed, 05 Mar 2008 18:43:36 +0800

Adobe Photoshop有着很悠久的版本历史，本文将介绍Photoshop各版本启动画面。

前身与Photoshop0.87-3.0版本的启动界面
......
Photoshop4.0-7.0版本的启动界面
......
Photoshop CS-CS3(8.0-10.0)版本的启动界面，改称为Photoshop Creative Suite(Photoshop CS)。
......
............

Tags - adobe , 设计 , design , 历史见证

解决IE5、IE6、IE7与W3C标准的冲突(IE7.js IE8.js)

Fri, 22 Feb 2008 23:34:46 +0800

如果分别用IE5、IE6、IE7浏览同一个网页，将可能出现不一样的效果。
这是它们之间对CSS的解析选择器不一样或错误和个别bug所导致。为了解决这些错误和bug。
我们不得不找到一个能平衡于它们之间的解决方法。

如png透明问题在IE5、IE6下无法显示出其效果，我们可能会使用CSS hack或者引入外部JavaScript来实现。譬如前面我提到过用pngfix的那个方法就是调用外部JavaScript来解决在IE5、IE6下png透明问题。当然还有更多的方法。

而现在有种更加完美的方法能兼容IE5、IE6、IE7的CSS选择器解析不一样问题。那就是： ie7 - js

ie7 - js中是一个JavaScript库（解决IE与W3C标准的冲突的JS库），使微软的Internet Explorer的行为像一个Web标准兼容的浏览器，支持更多的W3C标准，支持CSS2、CSS3选择器。它修复了许多的HTML和CSS问题，并使得透明PNG在IE5、IE6下正确显示。

目前该ie7 - js版本： 2.0 beta 3

用法：
直接引用Google Code服务器上的js文件。

IE7.js
使IE5、IE6升级至兼容IE7
注释使Internet Explorer版本号小于7的IE浏览器载入该代码。

IE8.js
使IE5、IE6、IE7支持更多的W3C标准（修复了许多的HTML和CSS问题）。
注释使Internet Explorer版本号小于8的IE浏览器载入该代码，而其它符合标准的浏览器则会忽略该代码，并在IE8出来后不干扰其工作。

PNG
此脚本仅修复了图像命名为：*-trans.png
遗憾的是，此方法透明的PNG图像不能平铺（重复）使用在背景上；也不能用在CSS “position”定位属性上。

除了直接引用Google Code服务器上的js文件外，如果你愿意你也可以下载然后引入
2.0 beta 3下载地址页面：http://ie7-js.googlecode.com/svn/version/2.0(beta3)/
右击另存下载地址：IE7.js IE8.js

演示：
http://ie7-js.googlecode.com/svn/test/index.html
Tags - code , javascript

Apple Safari 3.1 (525.9)苹果浏览器简体中文版for Windows

Thu, 21 Feb 2008 19:50:10 +0800

Apple最近频繁更新了Safari, 与2月15日, 发布Windows发布的同时还有 Tiger 与 Leopard 版的 Safari.

Digidea朋友立即对其进行完善

引用

这阵子 Apple 动作好快, 几天不看居然又更新了, 日期是 2 月 15 日, 同时发布的还有 Tiger 与 Leopard 版的 Safari.

此次变化不大, 在上一个全语言版的基础上, 除了常规的 WebKit 内核更新, 对语言文件又进行了一些完善, 就 Safari 目前的功能来看, 几乎可以说是完美了. 我又修改了替换用的中文字体, 相信显示效果应该能更好一些.

官方更新日志

- Huge plain text pastes are now much faster
- Photo uploading to auction websites now works
- Safari now logs unsafe javascript to system log
- Writing direction shortcuts now implemented

因为 Safari 的界面根据系统环境而定, 因此在这里我将系统与软件语言的关系说明一下.

系统语言↓ Safari 语言↓ 所需操作↓

英语英语 无需安装语言包
英语简中 安装语言包后将所有目录中 zh_CN.lproj 文件夹内的文件复制到 English.lproj 或 en.lproj 内
英语繁中 安装语言包后将所有目录中 zh_TW.lproj 文件夹内的文件复制到 English.lproj 或 en.lproj 内
简中英语 无需安装语言包并将所有目录内除 English.lproj 或 en.lproj 外并以 .lproj 结尾的文件夹删除
简中简中 安装语言包即可
简中繁中 安装语言包后将所有目录中 zh_TW.lproj 文件夹内的文件复制到 zh_CN.lproj 内
繁中英语 无需安装语言包并将所有目录内除 English.lproj 或 en.lproj 外并以 .lproj 结尾的文件夹删除
繁中简中 安装语言包后将所有目录中 zh_CN.lproj 文件夹内的文件复制到 zh_TW.lproj 内
繁中繁中 安装语言包即可
其他英语 无需安装语言包并将所有目录内除 English.lproj 或 en.lproj 外并以 .lproj 结尾的文件夹删除
其他简中 安装语言包后将所有目录中 zh_CN.lproj 文件夹内的文件复制到 English.lproj 或 en.lproj 内并将除 English.lproj 或 en.lproj 外以 .lproj 结尾的文件夹删除
其他繁中 安装语言包后将所有目录中 zh_TW.lproj 文件夹内的文件复制到 English.lproj 或 en.lproj 内并将除 English.lproj 或 en.lproj 外以 .lproj 结尾的文件夹删除

SkyDrive 下载地址：

引用

Apple Safari 3.1 (525.9)下载

Tags - apple , safari

AuroraNight风格投入使用

Wed, 20 Feb 2008 15:26:24 +0800

于2月13日开始制作NewYearNight的续作AuroraNight极光夜晚
期间在2月14日发布给bo-blog的blogger们使用，期间经过5、6次修改。

本准备刚好过了正月十五后才开始投入Blog使用，现提前一天投入使用！

即时截图：

使PNG图片格式在IE6中背景透明(pngfix)

Wed, 20 Feb 2008 15:06:56 +0800

很多朋友在制作网页时都会用到图片透明。使其部分透明的图片后面显示背景部分。
而现在流行的具有透明性的图片有GIF和PNG两种非常普及格式。

GIF(Graphics Interchange Format图像互换格式)可实现图像区域的部分或全局透明。现非常多的网站都将其运用到其中。
但是256色的限制GIF的使用范围。还有一个问题：譬如，当我们的图像边缘有阴影时，保存透明后会发现其边缘不是以渐变式透明显示，而是用灰度色显示而无透明而言。

解决上面GIF的缺陷方案最好方法就是使用现在网络上流行使用的另一种图像格式PNG(Portable Network Graphic Format流式网络图形格式)
但是PNG最大的问题就是，它在IE6下无法显示透明区域（Firefox、Opera、Safari均支持PNG透明），会有一种灰白色代替成为其背景色。这不是PNG这个格式图片的问题，而是IE6的BUG，没有将PNG的Alpha通道打开,造成透明PNG图片的在IE6上显示不出透明区域。

现在就有种方法是通过引入JavaScript的方式解决这个问题。

第一步：
新建一个pngfix.js文件写入以下代码（放在你网页的相同目录下）：

第二步：
在head标签中引入js文件

第三步（分两种情况）：
1、指定PNG图片使其在IE6下背景透明
在img标签中加入onload="fixPNG(this)"事件

2、页面内所有PNG图片使其在IE6下背景透明
在body表情中加入onload="fixPNGAll()"事件

需要注意的是：
如果你的网页需要符合XHTML 1.0标准的话，请用第三步中的2方法，因为1方法中img标签中的onload事件是不符合XHTML 1.0标准的

特殊情况（用PNG为button按钮的背景时）：
如果你要在input标签的背景中使用PNG图片，此js文件同样适用。

先在head标签中引入js文件

在body标签中加入onload="fixPNGAll()"事件

示例

其实还有其他一些方法也能解决PNG图片格式在IE6中背景透明的问题，Tim将下次跟大家共同探讨。
Tags - javascript , code

Alexa的Traffic Rank突进到一百四十万内

Mon, 18 Feb 2008 15:07:30 +0800

从在Alexa有Traffic Rank的12583052名到现在的1392008名有不错的进步，希望能再接再厉，突进十万。

截图：

用来提高Alexa排名的几个有效方法

Sun, 17 Feb 2008 18:34:50 +0800

这里所说的方法，都是合理合法的，不会受到搜索引擎的惩罚。

引用

1、安装Alexa工具条，或者安装Firefox下的SearchStatus插件。并且设置自己的Blog作为默认首页，这样每次你打开浏览器的时候，Alexa统计就开始工作了。

2、把Alexa排名统计的widget放在Blog上，当它被点击的时候，也相当于Alexa统计到一次PV，即使那个用户没有安装Alexa工具条。

3、如果可以的话，在你的公司或者办公室里的电脑里都安装上Alexa工具条。

4、在站长论坛里发贴子的时候留下你的链接，一般站长安装Alexa的较多，当他们访问你的Blog的时候，当然会有帮助。

5、给你的Blog添加一个Alexa分类，把有关Alexa的文章都放在里面，这样站长有更大的机会来到你的Blog，你的排名当然就容易上升。

6、找到你的Blog上最受欢迎的文章，把Alexa的链接添加上，或者使用第五点中所说的重定向链接到你自己内部的文章。

7、提供一些站长工具，这样站长就会经常来造访，并且提高你的Alexa排名，比如SEO 在线工具中的Google PageRank Checker就是一个很好的例子。

Tags - seo , 站长 , alexa

Concerto Gate(魔力宝贝2和谐之门)论坛风格

Fri, 15 Feb 2008 23:55:02 +0800

............

Tags - style , design , 设计 , discuz!

AuroraNight极光夜晚

Thu, 14 Feb 2008 04:21:06 +0800

极光夜晚神秘绚丽。

模版名称:AuroraNight

适用版本:bo-blog 2.1.0（+）

适用分辨率:1024*768（+）

测试浏览器:IE6/IE7、Firefox、Opera、Safari四大核心浏览器

演示地址:http://www.azuresky.com.cn/index.php?tem=AuroraNight

说明：此版面在NewYearNight新年之夜的基础上制作，以摆脱新年才能用的限制，配色的改动，天蓝色为强调色，不采用纯白色（#FFFFFF）为正文背景色以保护眼睛，内附blogtitle源文件，请自行修改,并保存为透明的png格式。

2008-02-18日更新：
1、发现在Opera下blogtitle.png被全透明化。看不到blogtitle.png。现已更新

2、采用在img的onload事件調用fixPNG(this)不符合XHTML 1.0标准。现已更新

3、发现images文件夹下缺少wmp.gif图片。现已更新，或自行上传一个

需要更新上传的文件：style.css、elements.php、blank.gif、iepngfix.htc

如果对符合XHTML 1.0标准不太在意，可以不理会。但建议更新。
另由于我的Vista系统，无法用IE6测试，因此谢谢"夜的记忆"帮忙测试。

点击这里下载文件

Tags - design , 设计 , style , template , 风格 , bo-blog

Azuresky Blog

CSS网页设计解决方案(Hacks Issues)

较常用的CSS层叠样式表缩写总汇

Mozilla给网站制作朋友们的CSS书写顺序建议

黑灰白网页，为全国哀悼日改网页样式为黑灰白色方法-CSS滤镜Gray

2008年05月19-21日全国哀悼日，为四川汶川默哀3分钟

中国雅虎、百度、谷歌的四川汶川救灾最新消息，雅虎还有捐款的通道

百度的赈灾图片也放出来，包含链向百度赈灾的专区

Google（谷歌）设的“寻找灾区的亲人”搜索专区：

震碎蜀地,流亡...向天...无力...

十种用JavaScript处理图片的特别效果

Azuresky Blog悄悄地Google PageRank为2

每个人都有傻瓜般的一面

提供“我爱中国”与“中国心”头像

奥运临近 达赖起兴 国外论评(解析做人不能太CNN)

Photoshop Express已经开始公测

对整个Blog的文章进行了SEO

Flash视频全屏播放的ActionScript

Flash网页在浏览器中全屏显示的详细方法

把Azuresky BLOG换回我自己最初的风格

博客SEO必知：搜索引擎Ping服务的一些地址

Apple(苹果)官方已经放出Safari 3.1 正式版下载

经典Logo改造成Web2.0样式

横空出世IE 8.0 Beta1安装与新体验

两个课程期末设计的窗体界面

Adobe Photoshop历代启动界面回顾(截至07年的CS3)

解决IE5、IE6、IE7与W3C标准的冲突(IE7.js IE8.js)

Apple Safari 3.1 (525.9)苹果浏览器简体中文版for Windows

AuroraNight风格投入使用

使PNG图片格式在IE6中背景透明(pngfix)

Alexa的Traffic Rank突进到一百四十万内

用来提高Alexa排名的几个有效方法

Concerto Gate(魔力宝贝2和谐之门)论坛风格

AuroraNight极光夜晚

奥运临近达赖起兴国外论评(解析做人不能太CNN)