Archive for the 'E - Learning' Category

收藏的一些PhotoShop资源提供下载

收藏的一些PhotoShop资源提供下载

Photoshop 动作集 662套

Photoshop 图案集 4套

PhotoShop笔刷52套

压缩包名:Photoshop_Resources_cnlidc.com.rar

压缩包大小:26,526 KB

压缩包下载地址:点击下载

Photoshop_Resources
Photoshop_Resources
Photoshop_Resources

精典配色方案

一、红色的色感温暖,性格刚烈而外向,是一种对人刺激性很强的色。红色容易引起人的注意,也容易使人兴奋、激动、紧张、冲动、还是一种容易造成人视觉疲劳的色。

1、在红色中加入少量的黄,会使其热力强盛,趋于躁动、不安。
2、在红色中加入少量的蓝,会使其热性减弱,趋于文雅、柔和。
3、在红色中加入少量的黑,会使其性格变的沉稳,趋于厚重、朴实。
4、在红中加入少量的白,会使其性格变的温柔,趋于含蓄、羞涩、娇嫩。

二、黄色的性格冷漠、高傲、敏感、具有扩张和不安宁的视觉印象。黄色是各种色彩中,最为娇气的一种色。只要在纯黄色中混入少量的其它色,其色相感和色性格均会发生较大程度的变化。

1、 在黄色中加入少量的蓝,会使其转化为一种鲜嫩的绿色。其高傲的性格也随之消失,趋于一种平和、潮润的感觉。
2、 在黄色中加入少量的红,则具有明显的橙色感觉,其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖。
3、 在黄色中加入少量的黑,其色感和色性变化最大,成为一种具有明显橄榄绿的复色印象。其色性也变的成熟、随和。
4、 在黄色中加入少量的白,其色感变的柔和,其性格中的冷漠、高傲被淡化,趋于含蓄,易于接近。

三、蓝色的色感冷嘲热讽,性格朴实而内向,是一种有助于人头脑冷嘲热讽静的色。蓝色的朴实、内向性格,常为那些性格活跃、具有较强扩张力的色彩,提供一个深远、广埔、平静的空间,成为衬托活跃色彩的友善而谦虚的朋友。蓝色还是一种在淡化后仍然似能保持较强个性的色。如果在蓝色中分别加入少量的红、黄、黑、橙、白等色,均不会对蓝色的性格构成较明显的影响力。

1、 如果在橙色中黄的成份较多,其性格趋于甜美、亮丽、芳香。
2、 在橙色中混入小量的白,可使橙色的知觉趋于焦躁、无力。

四、绿色是具有黄色和蓝色两种成份的色。在绿色中,将黄色的扩张感和蓝色的收缩感相中庸,将黄色的温暖感与蓝色的寒冷感相抵消。这样使得绿色的性格最为平和、安稳。是一种柔顺、恬静、优美的色。

1、 在绿色中黄的成份较多时,其性格就趋于活泼、友善,具有幼稚性。
2、 在绿色中加入少量的黑,其性格就趋于庄重、老练、成熟。
3、 在绿色中加入少量的白,其性格就趋于洁净、清爽、鲜嫩。

五、紫色的明度在有彩色的色料中是最低的。紫色的低明度给人一种沉闷、神秘的感觉。

1、 在紫色中红的成份较多时,其知觉具有压抑感、威胁感。
2、 在紫色中加入少量的黑,其感觉就趋于沉闷、伤感、恐怖。
3、 在紫色中加入白,可使紫色沉闷的性格消失,变得优雅、娇气,并充满女性的魅力。

六、白色的色感光明,性格朴实、纯洁、快乐。白色具有圣洁的不容侵犯性。如果在白色中加入其它任何色,都会影响其纯洁性,使其性格变的含蓄。

1、 在白色中混入少量的红,就成为淡淡的粉色,鲜嫩而充满诱惑。
2、 在白色中混入少量的黄,则成为一种乳黄色,给人一种香腻的印象。
3、 在白色中混入少量的蓝,给人感觉清冷、洁净。
4、 在白色中混入少量的橙,有一种干燥的气氛。
5、 在白色中混入少量的绿,给人一种稚嫩、柔和的感觉。
6、 在白色中混入少量的紫,可诱导人联想到淡淡的芳香。

附:终极配色手册(chm)下载

建议您使用防毒无弹窗的FireFox浏览器,上网冲浪更安全。
有数码相机?有很多图片?使用免费的图片管理软件Picasa,还送1G免费网络相册!

使用 XHTML+CSS 设计页面的 55 个原因

英文原文:55 Reasons to Design in XHTML-CSS

  1. 你可以从 zengarden, stylegala, cssimportcssbeauty 得到免费的链接;
  2. 你无须花费额外的时间来考虑你文档中标签的风格(大小写,或者属性是否使用引号等);
  3. 你无须额外考虑哪些标签必须关闭,而哪些是可以开着的;
  4. 通过有语意的标记,你可以“帮助”搜索引擎来传递更相关的内容;
  5. 通过缩小页面体积,你可以节省带宽开支,访客也可的得到更快的速度;
  6. 你可以更容易的过渡到 XHTML 2.0;
  7. 一旦你做了足够的训练,写页面将变得比 table/tr/td 的方式更加简便快速;
  8. 当写代码变得快捷时,你可以花费更多时间来考虑用户体验;
  9. 考虑一个页面的语意可以帮助你进行设计,以及决定信息结构;
  10. 你可以迅速建立一个测试站点来测试你的信息结构,而后只需要加上很少的更改便可完成外观;
  11. 你可以在后台已经大部分完成时再进行界面设计,这将帮助你的用户(或老板)来考虑还有多少要做的东西;
  12. 相对于 Flash,你有个确切的链接可以链接到你的页面;
  13. 浏览器中的控制按钮(例如字体大小,前进后退)可以正常工作(相对于 Flash);
  14. 重新设计或是调整全站的对齐方式是非常容易的;
  15. 对设计进行最终修改也是很容易的;
  16. 清晰的标记甚至使得 CMS 都不是必要的;
  17. 清晰的标记可以让另外一个开发者很快熟悉代码;
  18. 你可以将后台开发和前台设计彻底分开,甚至又两个不同的人来做;
  19. 你有很多方法通过调整标记来进行 SEO,而不影响最终的显示效果;
  20. 你可以完全控制你的页面打印出来的样子;
  21. 你的网站将在各种浏览器上被兼容;
  22. 使用 Web 标准将有助于你今后的工作,无须为不同浏览器分别进行代码编写;
  23. 关闭所有的标签,使得你的代码看起来更清晰;
  24. 有序的代码使得你的站点可以在更多浏览器上正常工作;
  25. 有序的代码可以让浏览器开发者们将更多的时间花在开发新功能,而不是使得渲染引擎的容错性上。
  26. 你的网站将可以工作在未来的浏览器上;
  27. 你的网站将可以工作在手机(或其它设备)上面;
  28. 你可以学到 XML 的基础知识,这在很多方面都有用处;
  29. CSS 文件将被保存到浏览器缓存中,从而获得更快的存取速度和更少的带宽使用;
  30. 你的文档可以轻松的用 XSLT 转换成各式各样的;
  31. 考虑语意可以使你更多的考虑内容;
  32. 考虑语意可以让你领悟更好的组织内容,当你在写其它文档时也会变得有条理很多;
  33. 你可以在你的履历或作品中写上更多的新技术;
  34. 主流的浏览器可以快速渲染一个符合标准的网页;
  35. 当你使用正确的方法时,你会感觉良好;
  36. 他们是这样做的:Dan Cederholm, Jeffrey Zeldman, Jason Santa Maria, Shaun Inman, Cameron Moll, Douglas Bowman, Dave Shea…;
  37. 你可以跟上潮流;
  38. 你学会欣赏新的浏览器,他们将进行竞争最终得到更好的浏览器;
  39. 不再有闪烁标签了;
  40. 严格的代码可以让你更容易发现问题;
  41. 你可以通过写相关的书来赚点钱;
  42. 如果你理解这些新方法,你将可以获得更多的工作机会;
  43. 你可以更好的了解浏览器的工作原理;
  44. 你可以使用像“对 Opera 友好”这样有酷名字的技巧和技术;
  45. 你将更加注意 metadata, document 和 character types;
  46. 更多的人这样做,互联网中的总流量会变小,网络将会更快;
  47. XHTML 比 HTML 听起来更酷;
  48. 有很多人讨论 XHTML 的优缺点,最终可以形成一个论坛;
  49. 你可以使用一个模板来建立多个网站;
  50. 学习快速读写代码使得使用更便宜的开发工具成为可能(如记事本);
  51. Google 知道:
    • 4,380,000 “XHTML better than HTML” > 4,370,000 “HTML better than XHTML”;
    • 206 “XHTML is beter than HTML” > 87 “HTML is better than XHTML”;
    • 2,130,000 “XHTML sucks” < 10,300,000 “HTML sucks”
  52. 当所有的浏览器都可以支持 MIME-type (XML)时,你将不需要将你的整站从 HTML 转换过来,直接送出正确的 MIME 就可以了;
  53. 当越来越多的人开始使用 XHTML 时,未来 IE 将能够识别正确的 MIME-type;
  54. 辅助功能必须要求图片具有 alt 属性;
  55. 没有如此多的理由来使用 HTML 或是整站 Flash。

网页设计必备资源集合

配色工具

配色工具请参考:为你的网页组合出一个完美的配色方案

免费的 CSS 导航栏菜单

图标

空白的 WordPress 模板

想做个 WP 主题?看看这些空白模板吧。

CSS 的模板

用表格定位和用 CSS 定位差多远啊。

死链检查器

在多个浏览器里面测试

更多类似工具

检查代码有效性

脚本

Favicons 生成器

字体

Web 2.0 工具

按钮

渐变工具

圆角框框

CSS 气泡对话框

CSS 工具

其他

参考煎蛋

禁止文本框粘贴功能

支持IE 6.0+ 、Mozlla、Firefox

代码:

<body>
<script type="text/javascript">
//not IE is required
function fncKeyStop(evt)
{
if(!window.event)
{
var keycode = evt.keyCode;
var key = String.fromCharCode(keycode).toLowerCase();
if(evt.ctrlKey && key == "v")
{
evt.preventDefault();
evt.stopPropagation();
}
}
}
</script>
<input onkeydown="fncKeyStop(event)" onpaste="return false" oncontextmenu = "return false;" />
</body>

MySQL 外键的设置及作用

外键的作用:

保持数据一致性,完整性,主要目的是控制存储在外键表中的数据。 使两张表形成关联,外键只能引用外表中的列的值!
例如:
a b 两个表
a表中存有 客户号,客户名称
b表中存有 每个客户的订单
有了外键后
你只能在确信b 表中没有客户x的订单后,才可以在a表中删除客户x

建立外键的前提: 本表的列必须与外键类型相同(外键必须是外表主键)。

指定主键关键字: foreign key(列名)

引用外键关键字: references <外键表名>(外键列名)

事件触发限制: on delete和on update , 可设参数cascade(跟随外键改动), restrict(限制外表中的外键改动),set Null(设空值),set Default(设默认值),[默认]no action

例如:

outTable表 主键 id 类型 int

创建含有外键的表:
create table temp(
id int,
name char(20),
foreign key(id) references outTable(id) on delete cascade on update cascade);

说明:把id列 设为外键 参照外表outTable的id列 当外键的值删除 本表中对应的列筛除 当外键的值改变 本表中对应的列值改变。

框架网页标记frameset

■ 框架概念 :

谓框架便是网页画面分成几个框窗,同时取得多个 URL。只需要 <FRAMESET> <FRAME> 即可,面所有框架标记需要放在一个总起的 html 档,这个档案只记录了该框架如何分割 ,不会显示任何资料,所以不必放入 <BODY> 标记,浏览这框架必须读取这档案 面不是其他框窗的档案。<FRAMESET> 是用来划分框窗,每一窗框由一个 <FRAME> 标 记所标示,<FRAME>必须在 <FRAMESET> 范围中使用。如下例:

<frameset cols="50%,*"> <frame name="hello" src="up2u.html"> <frame name="hi" src="me2.html">
</frameset>

此例中 <FRAMESET> 把画面分成左右两相等部分,左便是显示 up2u.html,右边则会显示 me2.html 这档案,<FRAME> 标记所标示的框窗永远是按由上而下、由左至右的次序

<FRAME>
用法:      定义一个帧
开始/结束标识: 必须/非法
属性:      name="..."定义帧的名字
scr="..."定义在帧中显示的内容的来源
frameborder="..."定义帧之间的边界(0或1)
margwidth="..."设置帧的边界和其中内容之间的间距
margheight="..."设置帧的边界和其中内容之间的间距化
noresize="..."使帧的尺寸不能变
scrolling="..."设置滚动条的表示方式(auto, yes, no)
空:       不允许

<FRAMESET>...</FRAMESET>
用法:      定义在一个窗口中帧的布局
开始/结束标识: 必须/必须
属性:      rows="..."设定行的数目
cols="..."设定列的数目
onload="..."当载入文档时的内部事件触发器
onunload="..."当卸载文档时的内部事件触发器
空:       不允许
注释:      FRAMESET可以嵌套
以上所述只是最简单的框架设定,若希望达到更合适的效果请加入或修改以下各参数。

标记:<FRAMESET>
例子:<frameset rows="90,*" frameborder="0" border=0 framespacing="2" border="2" bordercolor="#008000"></frameset>
功用:宣告HTML文件为框架模式,并设定视窗如何分割。

参数:

* COLS="90,*"
垂直切割画面(如分左右两个画面),接受整数值、百分数, * 则代表占用剩余的空间。数值的个数代表分成的视窗数目且以逗号分隔。例如 COLS="30,*,50%" 可以切成三个视窗,第一个视窗是 30 pixels 的宽度,为一绝对分割,第二个视窗是当分配完第一及第三个视窗后剩下的空间,第三个视窗则占整个视窗画面的 50% 宽度为一相对分割。你可自己调整数字。
* ROWS="120,*"
这是横向切割,将画面上下分开,数值设定同上。 COLS 与 ROWS 两参数尽量不要放在同一个 <FRAMESET> 标记中,因 Netacape 偶然不能显示这类型的框架,尽量采用多重分割,如以上各例。
* frameborder="0"
设定框架的边框,其值只有 0 和 1 , 0 表示不要边框, 1 表示要显示边框。
* border="0"
设定框架的边框厚度,以 pixels 为单位。
* bordercolor="#008000"
设定框架的边框颜色。颜色值请参考【调色原理】。
* framespacing="5"
表示框架与框架间保留的空白的距离。

标记:<FRAME>
例子:<frame name="top" src="a.html" marginwidth="5" marginheight="5" scrolling="Auto" frameborder="0" noresize framespacing="6" bordercolor="#0000FF">
功能:设定每一个框窗内的参数属性。
参数:

* src="a.html"
设定此框窗中要显示的网页档案名称,每个框窗一定要对应一个网页档案。
* NAME="top"
设定这个框窗的名称,这样才能指定框架来作链接,必须但任意命名。
* frameborder=0
设定框架的边框,其值只有 0 和 1 , 0 表示不要边框, 1 表示要边框。
* framespacing="6"
表示框架与框架间的保留的空白的距离。
* bordercolor="#008000"
设定框架的边框颜色。
* scrolling="Auto"
设定是否要显示卷轴,YES 表示要显示卷轴,NO 表示无论如何都不要显示卷轴,AUTO 视情况而定。
* noresize
设定不让使用者可以改变这个框框的大小,如没有设定此参数,使用者可随意地拉动框架改变其大小。
* marginhight=5
表示框架高度部分边缘所保留的空间。
* marginwidth=5
表示框架宽度部分边缘所保留的空间。

PhotoShop的.sal文件及使用方法

asl.JPG

ASL是自定义风格(Style Custom),其实是和风格面板是完全一样的,选定后,层风格对话框中间出现了和风格面板一致的风格库,默认情况下,风格库的第一个方格是不施加任何风格效果的选项,另外还包含了Adobe预设的三种风格。右端的小三角可以打开风格库的菜单,这也和风格面板完全一致,菜单包括以下内容:重置风格库 (Reset Styles),不管当前使用的是什么风格库,这一选项都允许用户回复到软件初始状态的默认风格库;调用风格库(Load Styles),用户可以调用外部风格库(ASL文件),Photoshop 6.0提供了一个sample.asl风格库,包含了16种不同的风格;保存风格库(Save Styles),可将用户当前使用的风格库保存为ASL文件,从而使得用户可以保存自己的风格设置,方便在不同主机上的交换;替换风格库(Replace Styles)则用外部风格库来替换当前风格库;重命名风格(Rename Style),在选中某一个风格时,可以重新为风格命名;删除(Delete Style)用来删除当前选中的风格;接下去的5个选项用来风格库的显示方式,它们是文本形式(Text Only)、小缩略图(Small Thumbnail)、大缩略图(Large Thumbnail)、小列表(Small List)和大列表(Large List)。

放到"\Program Files\Adobe\Photoshop CS\预置\样式"文件夹中,就可以调用了!

NetBeans的Ruby/RoR专用开发工具

nbrubyide.JPG

以前用NetBeans 6.0 M10,总是感觉运行起来非常吃力,要是再开个PhotoShop或Dreamweaver啥的就要受不了了,昨天从robbin哪里知道了这个NetBeans的Ruby/RoR专用开发工具

下载地址:http://deadlock.netbeans.org/hudson/job/ruby/

只有30MB大小,速度比RadRails还快!netbeans的RoR支持很强大,但也要注意两点:
1) 一定要用JDK6.0,否则netbeans会很慢
2) 一定要修改JDK的字体文件,否则中文显示乱码(参考资料

nbrubyide2.JPG

下载后是解压包,解压后运行bin目录中的nbrubyide.exe文件即可(Windows版)

netbeans Ruby IDE有很多很棒的快捷键,例如:

快速打开ruby类(包括系统类库) - Ctrl + O
快速打开当前项目文件 - Alt + Shift + O
在controller和view直接跳转 - Ctrl + Shift + A
在controller/model和test/spec之间跳转 - Ctrl + Shift + T
直接跳转到类和方法的源代码 - Ctrl + B
自动补齐 - Ctrl + \
方法参数提示 - Ctrl + P
快速修复提示 - Alt + Enter
上下文帮助 - Ctrl + Shift + Enter
重命名重构 - Ctrl + R

还有很多很多,可以参考这里:
http://wiki.netbeans.org/wiki/view/RubyShortcuts

这是robbin的截图:
nbrubyide3.JPG

CSS Hack汇总快查

屏蔽IE浏览器(也就是IE下不显示)
*:lang(zh) select {font:12px !important;} /*FF,OP可见*/
select:empty {font:12px !important;} /*safari可见*/
这里select是选择符,根据情况更换。第二句是MAC上safari浏览器独有的。

仅IE7识别
*+html {…}
当面临需要只针对IE7做样式的时候就可以采用这个HACK。

IE6及IE6以下识别
* html {…}
这个地方要特别注意很多地主都写了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。

仅IE6不识别
select { display /*IE6不识别*/:none;}
这里主要是通过CSS注释分开一个属性与值,流释在冒号前。

仅IE6与IE5不识别
select/**/ { display /*IE6,IE5不识别*/:none;}
这里与上面一句不同的是在选择符与花括号之间多了一个CSS注释。

仅IE5不识别
select/*IE5不识别*/ { display:none;}
这一句是在上一句中去掉了属性区的注释。只有IE5不识别

盒模型解决方法
selct {width:IE5.x宽度; voice-family :"\"}\""; voice-family:inherit; width:正确宽度;}
盒模型的清除方法不是通过!important来处理的。这点要明确。

清除浮动
select:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
Firefox中,当子级都为浮动时,那么父级的高度就无法完全的包住整个子级,那么这时用这个清除浮动的HACK来对父级做一次定义,那么就可以解决这个问题 。

节字省略号
select { -o-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
这个是在越出长度后会自行的截掉多出部分的文字,并以省略号结尾,很好的一个技术。只是目前Firefox并不支持。

只有Opera识别
@media all and (min-width: 0px){ select {……} }
针对Opera浏览器做单独的设定。

IE5.x的过滤器,只有IE5.x可见
@media tty {
i{content:"\";/*" "*/}} @import 'ie5win.css'; /*";}
}/* */

IE5/MAC的过滤器,一般用不着
/*\*//*/
@import "ie5mac.css";
/**/