本文旨在向你说明CSS Sprites的含义以及它的应用方法！
CSS Sprites是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言，不高于200KB的单张图片的所需载入时间基本是差不多的，所以无需 顾忌这个问题。
按照yahoo的rules for high performance web sites的原则，应当较少Client与Server端间 的HTTP Request次数。通过CSS Sprites方法将多张图片组装成单独的一张图片，可以有效减少HTTP请求 的次数。
当整幅图片载入完成后，你就可以使用CSS方法通过设置背景位置的方式完成所需图片的准确调用。
加速的关键，不是降低重量，而是减少个数。传统切图讲究精细，图片规格越小越好，重量越小越好，其实规格大小无所谓，计算机统一都按byte计算。客户端每显示一张图片都会向服务器发送请求，所以，图片越多请求次数越多，造成延迟的可能性也就越大。
Let’s start with the basics. What are CSS sprites?
Read more…
与Internet时间同步.不知你是否注意到现在有许多软件都可以让你电脑的时钟变得准确，其原理就是该软件选择一个服务器，当你上网的时候电脑内的时钟与服务器的时钟相比较，如果不准确的话就可以自动调整过来。而如今在WindowsXP也集成了这一功能。我们可以双击任务栏右下角的时钟，在“Internet时间”中进行调整。需要注意的是:如果你的电脑安装了防火墙，那么很有可能不能进行Internet时间调整。
在任务栏上显示星期与日期.这个其实不需设置，只要将任务栏拉高一点就可以了。方法是：将鼠标移到屏幕下边的任务栏的上边线位置，当鼠标指标变成双箭号时，按下左键，往上拖拉至两行高位置即可。系统托盘处即显示时间，日期及星期。注意：因WindowsXP预设是将任务栏锁住的，所以你可能将鼠标移至任务栏边界时，鼠标并不会变形，表示不让你拖拉。这时请先在任务栏空白处单击鼠标右键，将其快显菜单中的“锁定任务栏”前的勾去掉。
关机、重启只要1秒钟.如果你想让WindowsXP瞬间关机，那么可以按下CTRL+ALT+DEL，接着在弹出的任务管理器中点击“关机”→“关机”，与此同时按住CTRL，不到1秒钟你会发现系统已经关闭，简直就在眨眼之间。同样道理，如果在“关机”菜单中选择“重启”，即可快速重启。
Read more…
验证可用！这套代码用起来非常舒服，我们可以任意改变边框和背景的颜色；任意调整矩形的宽度！只是没办法调整高度，因为这套CSS代码本身是不限制圆角矩形宽度的，我们是在其外加一个DIV来限制其宽度，所以只能横向整！纵向整不了！
调整方法：通过调整CSS文件中的#Bruce内的width来调整矩形的宽度；将CSS文件中所有的#999统一换成你需要的边框颜色；在CSS文件.d1中调整背景颜色和内容填充距离、间距。 Read more…
鄙人非常想在自己的网站上添加一个在线翻译板块，当然是借用Google在线翻译内核（不是说翻译能力相当于高中生么！这里的高中生我觉得是语言的组织能力；在词汇量方面，只要你输入正确，计算机是无人可以与之匹敌的）。
网站是php的！实现思路是通过本站上的表单向谷歌在线翻译系统跨页传值，然后通过谷歌在线翻译得出结果，最后将结果取回本站呈现！理论上是可行的！
我也想利用谷歌来给我翻译！但是实际操作起来非常有难度，如何取值?语种下拉菜单如何与本站下拉菜单匹配?谷歌的在线翻译结果如何定向提取?我不了解Javascript c++ …… 那我们是不是就不用混了呢?非也、非也……
我们可以利用谷歌在线翻译提供的API端口来整合谷歌的在线翻译……就一般在线翻译软件而言，在输入文件的时候你必须输入从什么语种到什么语种，也就是说文件语种必须已知。那我如果不知道文件语种呢?怎么办?谷歌提供的API端口程序具有文件语种自动识别功能，将此功能独立分解出来就是下面这套代码：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
| < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google AJAX Language API - Basic Translation</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("language", "1");
function initialize() {
var text = "贴代码处";
google.language.detect(text, function(result) {
if (!result.error) {
var language = 'unknown';
for (l in google.language.Languages) {
if (google.language.Languages[l] == result.language) {
language = l;
break;
}
}
var container = document.getElementById("detection");
container.innerHTML = text + " is: <b>" + language + "</b>";
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<div id="detection"></div>
</body>
</html> |
使用方法：新建一个记事本文件；然后将代码整体贴到记事本里；将代码中－贴代码处－替换成你想知道是什么语种的文件（随便多少，其实几个词汇就够了。注意：贴代码的时候比如说泰文可能显示的是黑色方框，没关系，虽然记事本不显示可是语言代码构成没变，提交给这个API还是可以得出正确结论的！）；
将文件另存为UTF-8编码，保存；修改文件名称尾缀为html；用浏览器打开；
最后参照
各国语言简称表格 »
en 英文
en_US 英文 (美国)
ar 阿拉伯文
ar_AE 阿拉伯文 (阿拉伯联合酋长国)
ar_BH 阿拉伯文 (巴林)
ar_DZ 阿拉伯文 (阿尔及利亚)
ar_EG 阿拉伯文 (埃及)
ar_IQ 阿拉伯文 (伊拉克)
ar_JO 阿拉伯文 (约旦)
ar_KW 阿拉伯文 (科威特)
ar_LB 阿拉伯文 (黎巴嫩)
ar_LY 阿拉伯文 (利比亚)
ar_MA 阿拉伯文 (摩洛哥)
ar_OM 阿拉伯文 (阿曼)
ar_QA 阿拉伯文 (卡塔尔)
ar_SA 阿拉伯文 (沙特阿拉伯)
ar_SD 阿拉伯文 (苏丹)
ar_SY 阿拉伯文 (叙利亚)
ar_TN 阿拉伯文 (突尼斯)
ar_YE 阿拉伯文 (也门)
be 白俄罗斯文
be_BY 白俄罗斯文 (白俄罗斯)
bg 保加利亚文
bg_BG 保加利亚文 (保加利亚)
ca 加泰罗尼亚文
ca_ES 加泰罗尼亚文 (西班牙)
ca_ES_EURO 加泰罗尼亚文 (西班牙,Euro)
cs 捷克文
cs_CZ 捷克文 (捷克共和国)
da 丹麦文
da_DK 丹麦文 (丹麦)
de 德文
de_AT 德文 (奥地利)
de_AT_EURO 德文 (奥地利,Euro)
de_CH 德文 (瑞士)
de_DE 德文 (德国)
de_DE_EURO 德文 (德国,Euro)
de_LU 德文 (卢森堡)
de_LU_EURO 德文 (卢森堡,Euro)
el 希腊文
el_GR 希腊文 (希腊)
en_AU 英文 (澳大利亚)
en_CA 英文 (加拿大)
en_GB 英文 (英国)
en_IE 英文 (爱尔兰)
en_IE_EURO 英文 (爱尔兰,Euro)
en_NZ 英文 (新西兰)
en_ZA 英文 (南非)
es 西班牙文
es_BO 西班牙文 (玻利维亚)
es_AR 西班牙文 (阿根廷)
es_CL 西班牙文 (智利)
es_CO 西班牙文 (哥伦比亚)
es_CR 西班牙文 (哥斯达黎加)
es_DO 西班牙文 (多米尼加共和国)
es_EC 西班牙文 (厄瓜多尔)
es_ES 西班牙文 (西班牙)
es_ES_EURO 西班牙文 (西班牙,Euro)
es_GT 西班牙文 (危地马拉)
es_HN 西班牙文 (洪都拉斯)
es_MX 西班牙文 (墨西哥)
es_NI 西班牙文 (尼加拉瓜)
et 爱沙尼亚文
es_PA 西班牙文 (巴拿马)
es_PE 西班牙文 (秘鲁)
es_PR 西班牙文 (波多黎哥)
es_PY 西班牙文 (巴拉圭)
es_SV 西班牙文 (萨尔瓦多)
es_UY 西班牙文 (乌拉圭)
es_VE 西班牙文 (委内瑞拉)
et_EE 爱沙尼亚文 (爱沙尼亚)
fi 芬兰文
fi_FI 芬兰文 (芬兰)
fi_FI_EURO 芬兰文 (芬兰,Euro)
fr 法文
fr_BE 法文 (比利时)
fr_BE_EURO 法文 (比利时,Euro)
fr_CA 法文 (加拿大)
fr_CH 法文 (瑞士)
fr_FR 法文 (法国)
fr_FR_EURO 法文 (法国,Euro)
fr_LU 法文 (卢森堡)
fr_LU_EURO 法文 (卢森堡,Euro)
hr 克罗地亚文
hr_HR 克罗地亚文 (克罗地亚)
hu 匈牙利文
hu_HU 匈牙利文 (匈牙利)
is 冰岛文
is_IS 冰岛文 (冰岛)
it 意大利文
it_CH 意大利文 (瑞士)
it_IT 意大利文 (意大利)
it_IT_EURO 意大利文 (意大利,Euro)
iw 希伯来文
iw_IL 希伯来文 (以色列)
ja 日文
ja_JP 日文 (日本)
ko 朝鲜文
ko_KR 朝鲜文 (南朝鲜)
lt 立陶宛文
lt_LT 立陶宛文 (立陶宛)
lv 拉托维亚文(列托)
lv_LV 拉托维亚文(列托) (拉脱维亚)
mk 马其顿文
mk_MK 马其顿文 (马其顿王国)
nl 荷兰文
nl_BE 荷兰文 (比利时)
nl_BE_EURO 荷兰文 (比利时,Euro)
nl_NL 荷兰文 (荷兰)
nl_NL_EURO 荷兰文 (荷兰,Euro)
no 挪威文
no_NO 挪威文 (挪威)
no_NO_NY 挪威文 (挪威,Nynorsk)
pl 波兰文
pl_PL 波兰文 (波兰)
pt 葡萄牙文
pt_BR 葡萄牙文 (巴西)
pt_PT 葡萄牙文 (葡萄牙)
pt_PT_EURO 葡萄牙文 (葡萄牙,Euro)
ro 罗马尼亚文
ro_RO 罗马尼亚文 (罗马尼亚)
ru 俄文
ru_RU 俄文 (俄罗斯)
sh 塞波尼斯-克罗地亚文
sh_YU 塞波尼斯-克罗地亚文 (南斯拉夫)
sk 斯洛伐克文
sk_SK 斯洛伐克文 (斯洛伐克)
sl 斯洛文尼亚文
sl_SI 斯洛文尼亚文 (斯洛文尼亚)
sq 阿尔巴尼亚文
sq_AL 阿尔巴尼亚文 (阿尔巴尼亚)
sr 塞尔维亚文
sr_YU 塞尔维亚文 (南斯拉夫)
sv 瑞典文
sv_SE 瑞典文 (瑞典)
th 泰文
th_TH 泰文 (泰国)
tr 土耳其文
tr_TR 土耳其文 (土耳其)
uk 乌克兰文
uk_UA 乌克兰文 (乌克兰)
zh 中文
zh_CN 中文 (中国)
zh_HK 中文 (香港)
zh_TW 中文 (台湾)
得出结论！ Read more…
如何实现Firefox/3.5.1地址栏输入地址在新标签栏打开?
如何实现Firefox/3.5.1标签栏地址在新标签页打开?
我一直使用Firefox但是最近将它升级到3.5.1后发现Tab Mix Plus失效了,旧版本中它的作用就是用来设定：地址栏输入新地址在新标签页打开！本来这一点通过Firefox默认的Alt+Enter也能实现！但是输入新地址老是按着个Alt着实有点烦躁。FF更新到3.5.1后，发现Tab Mix Plus失效了，怎么办?
请安装Tab Mix Lite CE吧，个人感觉这个跟Tab Mix Plus的实现效果一样！注意一点：在组件安装过程中可能碰到最后一步重启Firefox后安装无效的情况，网上说的解决办法挺多，我个人是通过重启电脑实现完整安装的……
下载地址
看来学学Javascript真的是非常有必要。各种效果只要一小段代码就可以实现，非常的诱人！像上次的鼠标滑过变色表格一样，大家灵活运用吧！
ps.验证可用！
Read more…
Adobe公司的产品PhotoShop从第一版到如今的cs版本，功能之强大；使用之方便得到了世人的赞同。眼花缭乱的功能让菜鸟们无从入手，总得通过鼠标一个个点击去试用，令到工作效率大大地降低。反观PS的高手们，左手摸着键盘，右手按着鼠标，唰一声就完成了一个作品，简直令人叹为观止。在这里，就把本人精心收集的PS技巧一次奉献给大家：备忘！
1、快速打开文件
双击Photoshop的背景空白处（默认为灰色显示区域）即可打开选择文件的浏览窗口。
2、随意更换画布颜色
选择油漆桶工具并按住Shift点击画布边缘，即可设置画布底色为当前选择的前景色。如果要还原到默认的颜色，设置前景色为25％灰度（R192，G192，B192）再次按住Shift点击画布边缘。
3、选择工具的快捷键
可以通过按快捷键来快速选择工具箱中的某一工具，各个工具的字母快捷键如下：
选框-M 移动-V 套索-L 魔棒-W 喷枪-J 画笔-B 铅笔-N 橡皮图章-S 历史记录画笔-Y 橡皮擦-E 模糊-R 减淡-O 钢笔-P 文字-T 度量-U 渐变-G 油漆桶-K 吸管-I 抓手-H 缩放-Z 默认前景和背景色-D 切换前景和背景色-X 编辑模式切换-Q 显示模式切换-F 另外，如果我们按住Alt键后再单击显示的工具图标，或者按住Shift键并重复按字母快捷键则可以循环选择隐藏的工具。
4、获得精确光标
Read more…
初学DIV+CSS应该理解HTML标签的语义。
如今Web标准都被通俗的叫做“div+css”或者“层布局”。我不反对这种便宜行事的叫法。但是这样会陷入一个误区：即大量的使用div标签作为结构元素。事实上这是一种更高级的div滥用(Jeffrey Zeldman在《网站重构》一书中提到）。
HTML为我们提供了相当丰富的标签，每个标签都有它各自的含义。我认为在设计时，除了遵循HTML语法以外，应该充分利用并遵守各标签的“语义”。如标题文字应该包含在h1-h6中，大段的文字内容应该由<p>进行分段而不是<br />，列表项应该放在ul或ol或dl中，表格形式的数据应该仍然用table布局。
为什么要这样做？一个很有说服力的原因是，保证在用户去掉CSS显示的情况下，网页能够尽量有效的将内容的结构层次显示出来。如果全部用div，当去掉CSS之后，整个网页就失去了层次，只剩下一些杂乱的文字碎片。这并不符合Web标准对低配置兼容性的要求。
我下面详细的列举一下我对一些标签的语义的理解：
Read more…
Keep talking: