对于Block与Inline级的元素经常会混在一起，现在就梳理一下这些元素：
对于Block级的元素来说，通常会在渲染时（rendered）会新起一行，以下元素是基础Block级元素：

ADDRESS – Address
BLOCKQUOTE – Block quotation
CENTER – Centered block
DIR – Directory list
DIV – Generic block-level container
DL – Definition list
FIELDSET – Form control group
FORM – Interactive form
H1 – Level-one heading
H2 – Level-two heading
H3 – Level-three heading
H4 – Level-four heading
H5 – Level-five heading
H6 – [...]

转载自:岁月如歌
源文地址：http://lifesinger.org/blog/2010/01/study-jquery-in-a-simplified-way/
学习复杂代码的最好方法是简化：

(function(win, undefined) {
var jQuery = function(selector, context) {
// jQuery 对象就是 init 函数的一个实例
return new jQuery.fn.init(selector, context);
},
[...]

最近在研究Air桌面程序，准备用Ajax桌面开发套路来试试。
其他都没什么，很顺利，但是到CSS样式时却头疼的很。（当然要比适应IE6好很多很多）
这个“头疼”其实不是什么大碍，只是一些常用的CSS属性得不到支持。
比如：box-shadow text-shadow
但是一些非常特殊的属性还支持：
如：-webkit-transform
这是一个Webkit还在研发的属性，竟然都支持。
所以说Air很太狠了，说是支持HTML与CSS但是却没有一个总的列表，只是给了一个链接，说是支持一些Webkit的属性，但是有些不支持。
这里的有些范围可就大了去了。
所以说Air不够厚道。
在Adobe的交流地方，一位兄弟说出了我的心声
I was wondering if support for the other css webkit extensions that aren’t listed here will be coming? It may be a small thing but I don’t understand why text-shadow couldn’t be supported. Any thoughts

除了上面的一些CSS 3的属性不支持外，几乎CSS 2还是都支持的由其是text-overflow的支持，让我们省了不少事。但是感觉支持的不是很好，当鼠标先中后，后面的字还是会出来，由其是带圆角的时候。
而对于Webkit的很多私有属性其实都是不支持的，包括他自己列出来的一些，幸好虽然不支持CSS 3的border-radius但是支持-webkit-border-radius也算是一大幸事。
现在Air 2 beta已经出炉，居说会完全支持CSS 3与HTML5希望这是真的。

做为前端组的一员，我们到底是需要对产品或需求有怎么样的理解?
我们需要什么样的资料来整理思路？
时常开发时遇到的问题是如何做好产品？
第一：需要理解需求
但是不可能去要求前端的每一位人员（包括设计）去理解DFD图或UML图，这些图虽然可以表达出大量的信息，但是说实话，真正理解的人并不多，也许你是这方面的高手。
对于抽象的数据与文字，更多的方法，我们是画一些草图，这样，可以方便工作流中的每位同事对相同事物的共通理解，减少产生奇异的几率。

第二：需要确定实例与权重
对于功能的理解已经到位时，我们需要再进入细化，那就是功能的权重叠加法。
页面功能太多时，需要有主线+分支的方法进行量化，要定义好目标与结果。
最终达到目的后进行反推，用分支把方法串连起来形成一个整体。
 
第三：测试人员要清楚自己的角色定位
测试人员与设计人员一样，需要把自己的定位弄清楚，不可盲目的去测试软件的好与坏。
所以测试人员需要清晰自己的角色目标与角色结果，然后进行分批的测试。
第四：没人想把自己当傻瓜
所有的用户都希望有简单与再简单的功能与界面，但是如果只有一张白纸，不是所有人都能画出梵高的画。

所以需要我们去为其编制一套流程，我们要引着他们一步一步的走，最终达到他们的目的地。
还是那句：我们需要简单的界面，但是不需要更简单的界面。

用Firefox打开Google时，首先只有Logo与搜索，其他的功能都隐藏了，但是当你点一下空白处，或是等待10秒，便会出现以前的界面。
Google在官方博客中表示，将会让所有网民看到新主 页。Google在文章中说：“对于绝大多数访问Google主页的人来说，他们的目的是搜索，这种简洁、最精简的界面给他们提供了最需要的东西。”
据博文称，Google推出了十个版本的新主页，隐藏不同的要素，观察了网民的反应，最终决定了“淡入”方向。
一个小举动，却又表示了Google在对用户体验方面的不断改进。

两个比较实用的CSS在线工具。
 
CSS校验工具：
可以检验CSS文档里面的CSS哪些是没有用到的。
http://services.immike.net/css-checker/
 
CSS格式化：
可以把CSS按Class与SupClass排列，并且可以按字母顺序排列。
http://styleneat.com/index.php

网页设计背景
网页设计是从围绕以屏幕为基础的用户交互工具的软件图形用户界面设计发展而来。 
网页设计包括更广泛的设计实践领域，并吸收多学科的技术与知识，虽然它无法在这些学科各自的范围界限内被完全理解。

设计的定位
设计来源于许多各类的社会活动、并成为它们之间的媒介。设计与艺术有着本质性的不同，而两者又不断相互作用。
 
注：限制条件
1.显示器 2.浏览器 3.现代技术

网页与软件的不同
软件毕竟是带有明确任务的、关注文件处理领域的工具（是一种“带来”的模式）。 而网络在应用方面更为广泛。一般来说，内容导向性经任务导向性体现得更多，因此建立的客户服务模式不是“带来”，而是转向，也就是说用户可以运用动态链接获取不断更新的信息网页。这一点与图书馆学和信息设计学有相近的实际意义。
网页设计与交互体验
“适合人体”原则-大约在二次世界大站时期演化为人体工程学（人性因素），其驱动力量来源于我们在与机器设备的接触中所遇到过最复杂、最困难、最危险的挑战：驾驶飞行器。
“适合思想”原则-传统的交互方式来源于物质实体，而电脑科学则依靠于设计。 如：开车的有开车的思维模式，来帮助他们了解车辆的行驶趋势，这与电脑的优势在于，车内的发动机，传动装置和驾驶杆都是实体。
在电脑方面则需要有一套思维模式来适用从Hotmail到Google等许多不同的系统。这些系统有一个共同点，都在电脑里运行并且目前来讲都是基于键盘与鼠标。
对于表单的设计，如果一次出现多于7项时会开始下降，基于这点原因AT&T公司的贝尔实验室研发了3+4的电话号码构成模式，并最终被确认为美国能用模式。
一切都要得益于自然世界的经验，人类与数字处理系统的交互也按类似的步骤实现。 在人机交互中，基本上当某个软件用户对一个操作的反应等待时间超过1秒，他便会感到不适。从这一点出发，就是一个需要前端解决的重要问题，也是上网体验的一个重要因素。
最好的交互体验在哪里可以找到？
游戏设计！
玩家的动作与屏显反应之间的系统是创造非凡游戏体验的关键（即使对于非操作者而言）。—-街头霸王II 销售额接近美国大片 这就是为何Wii为何如此的成功！
暴雪娱乐的副总裁Rob Pardo在游戏开发者大会GDC2009上表示微软和索尼应当适应型的游戏方式和游戏机制，并做出相应的改进。他建议两家公司学习任天堂，改进自己的游戏机。他说道：“如果（索尼和微软）不能适应新的游戏方式和游戏机制，那就不要推出新的游戏机了，要不我们得到的只能是糟糕的游戏机。”
Rob Pardo也点出了《魔兽世界》至今没有登陆家用机平台的原因。这些游戏平台设计时就没有考虑某一些类型的游戏。“有很多我们开发的这类型游戏（大型网游）没办法在游戏主机在运行，就是因为这类设备不支持。RTS游戏在游戏主机上表现不佳也是这个原因。要是我是主机开发商，我会坐下来好好研究如何让我开发的主机能够支持所有的游戏。那才是一个真正酷的主机。
网页设计项目工作流程

 
部分内容节选自：What Is Web Design。

《第一财经周刊》做了一件很有意义的工作，该杂志找到多达1028个公司人，让他们填写一份有167个问题的冗长问卷（全是主观题），并且把这些题目按照11个行业、58种产品或服务分类统计。
调查样本主要为在京、沪、广、深等城市公司工作的年轻公司人。其中男性465人，女性563人。年龄在25岁到30岁的公司人占据了主要比例，他们共有514人；年龄在20岁至25岁的有265人，30岁至35岁之间有211人，35岁以上的38人。
接受调查的这个群体—一线城市为主的公司人—他们所拥有的话语权、消费能力和对潮流的把握，那么这种变化可能更应该引起相关品牌的重视。因为这群人代表了城市消费的主要力量，他们既是优秀品牌现在可以倚靠的中坚，也是决定这些品牌未来地位的关键。他们是一群适应了快节奏的人，他们是一群喜欢尝试新产品新服务的人，并且，有一点一定要特别记住，他们还是左右潮流的人。
调查中，对所有产品都用三个问题来限定：1、你现在使用的该产品品牌是什么？2、你已经弃用的该产品品牌是什么？3、你未来打算购买的该产品品牌是什么？
按照通俗的解释，这三个问题大致可以体现一个市场各品牌当前、过去、未来的市场占有率。不过我们更愿意说，这些百分比体现了品牌与公司人关系的变化趋势。
看一些互联网从业者可能感兴趣的：
浏览器：IE的黄昏 IE 遨游 Firefox
微软的IE仍然是公司人首选的互联网浏览器，占公司人用户的46.53%—尽管他们中的很多人都抱怨IE的运行速度慢、弹出插件多，但看在它是唯一能支持网银平台的浏览器的份上也就都忍了。排名第二的是遨游（19.1%），它同样采用IE内核。近年崛起的FireFox和谷歌Chrome浏览器也迅速获得了大量用户，它们的使用率分别达到10.57%和7.68%，超过腾讯TT浏览器的6.62%。 但在弃用调查中，竟有70.34%的用户声称他们准备弃用IE—这是个惊人的数据。同样居于前列的还有同属IE内核的遨游和腾讯TT。而谷歌Chrome浏览器在公司人考虑使用的浏览器中挤进了前三。这不能不说是IE的忧郁—浏览器已经是微软在互联网领域的最后一块阵地了，公司人真的要放弃它吗？
门户网站：新浪回归 新浪 搜狐 网易 人们讨论新浪合并分众业务的时间并不是太长。现在还是让我们回归到新浪的本位—一家新闻类门户网站。 在集合了全国数百家主要媒体资源，以及建立起流水线一般的编辑流程之后，新浪仍然是眼下最受公司人欢迎的网络门户，用户首选的比例为40.73%；与新浪的综合性相比，搜狐让人印象深刻的地方恐怕在于它在部分内容上的精耕细作，比如体育和娱乐；网易也是老牌门户之一，最近两年在社会新闻、商业编辑上的进步明显，而且资讯页面与其占有大量用户的信箱有着不错的结合。但无论是搜狐还是网易，与第一名新浪相比仍差距较大，其用户首选比例分别为11.46%和9.79%。
搜索引擎：百度谷歌之争 百度 [...]

什么是伪类？
伪类：伪类对元素进行分类是基于特征(characteristics)而不是它们的名字、属性或者内容；原则上特征是不可以从文档树上推断得到的。
伪类有：:first-child:link:vistited:hover:active:focus:lang
什么是伪元素？
伪元素：伪元素是创造关于文档语言能够指定的文档树之外的抽象。
伪元素有：:first-line:first-letter:before:after
两者可以说都是一种CSS的规则，可以很方便的使用，但是其中却有一点让人很是疑惑，就是其CSS权重
伪类的的权重是10，这点大家都没有什么异议。但是伪元素的权重是1这点可能会有些歧义
e.g.
<p id=’t'>this is text for test,Yse just for test</p>
p#t{
color:blue;
}
p:first-line{
font-size:300%;
color:yellow;
}
按权重算，p#t应该是101，p:first-line应该是2
但是在浏览器一看，第一行却是黄色！这是为什么呢？
原来伪元素是创造关于文档语言，这点需要详细的理解一个其含义
其实就是相当于这样
e.g.
<p id=’t'><P:first-line>this is text for test,Yse just for test</P:first-line></p>
很是有意思的规则，并且关于CSS的版本不同，表现的形式也将不同。更多详解请看W3C Selector pseudo-elements

以下是非常完整的正则教程，所以我就不再罗嗦了，想学习相关知识请点：
一篇非常详细的正则入门
目录

本文目标
如何使用本教程
正则表达式到底是什么东西？
入门
测试正则表达式
元字符
字符转义
重复
字符类
分枝条件
反义
分组
后向引用
零宽断言
负向零宽断言
注释
贪婪与懒惰
处理选项
平衡组/递归匹配
还有些什么东西没提到
联系作者
最后,来点广告……
网上的资源及本文参考文献
更新纪录

javascript正则使用–详细讲解了一下正则在javascript中的应用