CSS权威指南和HTML与XHTML权威指南
作者:骆驼 日期:2006-10-19 07:29
《CSS权威指南》是O'Reilly公司出版的Web制作权威指南系列中的一本。该系列还包括《HTML与XHTML权威指南》、《JavaScript权威指南》和《Dynamic HTML: The Definitive Guide》。
CSS有望在Web上大显身手。它在Internet Explorer 5.0和Opera 3.6中得到了很好的实现,而且CSS1将在Netscape的Mozilla浏览器上得到完全的实现。种种迹象表明,CSS将很快成为Web创作者有用、可靠而强大的工具。
CSS是W3C认可的用于丰富Web页视觉表现力的方法。本书提供了对CSS1和CSS定位的完整的描述,同时也给出了CSS2的概述。本书对CSS的每个属性都做了详细的探究,同时讨论了各个属性之间如何协调,以及怎样避免一些常见错误。
本书的特点在于,它是第一本将CSS与当前浏览器支持结合起来描述的读物,而不仅仅是讲述CSS理论上应该如何工作,因此它为Web创作者和编辑人员高效使用CSS提供了全面的指南。
web2.0中流行的设计元素:颜色
作者:骆驼 日期:2006-10-07 07:20
★淡淡的浅色系及延伸应用
此类颜色似乎最早被应用在一些文档处理软件比如word,和操作系统里(比如MacOSX)用于分类归档,标记,或者突出显示使用.此类颜色给人的感觉很环保,不伤眼睛,而且对比度恰到好处,既可以有效区分,又不会显的太过突兀.
google,Yahoo更为成熟的运用了这些颜色.MSN在新版网站中也设置了Simple White主题选择,并且新的LIVE系列产品更是对那种淡淡的兰色与1PX线条情有独忠~另外一些新兴的WEB-base办公软件也大量选用了此类颜色!事实证明,这些颜色的运用取得了大部分用户的认可并领导了趋势!
例子:GMail,yahoo360,live.com,start.com,netvibes,rember the milk
常用CSS缩写语法总结
作者:骆驼 日期:2006-08-23 07:27
颜色
16进制的色彩值,如果每两位的值相同,可以缩写一半,例如:#000000可以缩写为#000;#336699可以缩写为#369;
盒尺寸
通常有下面四种书写方法:
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:1em 0 2em 0.5em;
边框(border)
边框的属性如下:
border-width:1px;
border-style:solid;
border-color:#000;
可以缩写为一句:border:1px solid #000;
语法是border:width style color;
网页Javascript特效库2006
作者:骆驼 日期:2006-08-05 07:23
CodeThat网站之CodeThatTable技术研究心得
作者:骆驼 日期:2006-07-29 08:06
首先向大家介绍一下
网站地址是http://codethat.com ,这是一个专业研究开发JavaScript程序的网站,里面的JavaScript应用程序十分的经典,JS的应用程度可以用“绚烂”来形容。目前他们用JavaScript开发的产品主要有GRID、TABLE、 MENU、 TREE、 XPBAR、 HINT、 EDITOR、 TAB、 FORM 、CALENDAR、 SCROLLER、 SHOPPINGCART、 TREEPHP、 PACKER等,有兴趣的可以先去观赏一下。
昨天本人花费了一天的时间研究了他们其中一个产品CodeThatTable,即用JavaScript实现表格功能(前台页面操作,不涉及后台可大大提升页面速度),该表格主要包含了数据分页、数据排序、数据筛选、数据搜索等众多强大的功能。而且用户可以通过参数控制改变表格的样式及其它的设定。CodeThatTable的功能主要如下图所示,当然他们的产品都可以和数据为、CSV、XML等众多数据源进行结合操作哦。
IE与Firefox下对CSS解析的区别及解决方案
作者:骆驼 日期:2006-07-18 14:06
1、IE与Firefox下对CSS解析的区别,这是我在使用中的一些经验,拿出来和大家分享,希望大家继续
对高度的解析
IE:将根据内容的高度变化,包括未定义高度的图片内容,即使定义了高度,当内容超过高度时,将使用实际高度
Firefox:没有定义高度时,如果内容中包括了图片内容,MF的高度解析是根据印刷标准,这样就会造成和实际内容高度不符合的情况;当定义了高度,但是内容超过高度时,内容会超出定义的高度,但是区域使用的样式不会变化,造成样式错位。
结论:大家在可以确定内容高度的情况下最好定义高度,如果真的没有办法定义高度,最好不用使用边框样式,否则样式肯定会出现混乱!
img对象alt和title的解析
alt:当照片不存在或者load错误时的提示;
title:照片的tip说明。
在IE中如果没有定义title,alt也可以作为img的tip使用,但是在MF中,两者完全按照标准中的定义使用
结论:大家在定义img对象时,最后将alt和title对象都写全,保证在各种浏览器中都能正常使用
其他的细节差别
当你在写css的时候,特别是用float: left(或right)排列一窜图片时,会发现在firefox里面正常而IE里面有问题。无论你用margin:0,还是border: 0来约束,都无济于事。
其实这里还有另外一个问题,就是IE对于空格的处理,firefox是忽略的而IE对于块与块之间的空格是处理的。也就是说一个div结束后要紧接着一个div写,中间不要有回车或者空格。不然也许会有问题,比如3px的偏差,而且这个原因很难发现。
非常不走运的是我又碰到了这样的问题,多个img标签连着,然后定义的float: left,希望这些图片可以连起来。但是结果在firefox里面正常而IE里面显示的每个img都相隔了3px。我把标签之间的空格都删除都没有作用。
后来的解决方法是在img外面套li,并且对li定义margin: 0,这样就解决了IE和firefox的显示偏差。IE对于一些模型的解释会产生很多错误问题,只有多多尝试才能发现原因。
2、嵌套DIV:父DIV的高度不能根据子DIV自动变化的解决方案
用CSS的!important解决IE和Firefox的布局差别
作者:骆驼 日期:2006-07-11 08:28
在设计《网页设计师》页面的时候,有一个问题一直困扰着我,主菜单在IE和其他(Mozilla、Opera等)浏览器里显示的效果偏差2px。截图如下:
IE中的效果

Mozilla Firefox中的效果

这是因为IE对盒之间距离的解释的bug造成的(参考onestab的" 浮动模型的问题 ")。我一直没有解决这个问题,直到我翻译 " 表格对决CSS--一场生死之战 "时,作者的一个技巧提示帮我找到了解决的方法:用!important。
!important是CSS1就定义的语法,作用是提高指定样式规则的应用优先权(参见:W3.org的解释)。语法格式{ sRule!important },即写在定义的最后面,例如:
box{color:red !important;}
正则表达式30分钟入门教程 [转载unibetter大学生社区]
作者:骆驼 日期:2006-07-08 09:54
本文目标
30分钟内让你明白正则表达式是什么,并对它有一些基本的了解,让你可以在自己的程序或网页里使用它。一旦入门后,你可以从网上找到更多更详细的资料来继续学习。
别被下面那些复杂的表达式吓倒,只要跟着我一步一步来,你会发现正则表达式其实并不像你想像中的那么困难。当然,如果你看完了这篇教程之后发现自己明白了很多,却又几乎什么都记不得,那也是很正常的--其实我认为没接触过正则表达式的人在看完这篇教程后能把提到过的语法记住80%以上的可能性为零。这里只是让你明白基本道理,以后你还需要多练习,多查资料,才能熟练掌握正则表达式。
说明
正则表达式是用于进行文本匹配的工具,所以本文里多次提到了在字符串里搜索/查找,这种说法的意思是在给定的字符串中,查找与给定的正则表达式相匹配的部分。有可能字符串里有不止一个部分满足给定的正则表达式,这时每一个这样的部分被称为一个匹配。匹配在本文里可能会有三种意思:一种是形容词性的,比如说一个字符串匹配一个表达式;一种是动词性的,比如说在字符串里匹配正则表达式;还有一种是名字性的,就是刚刚说到的“字符串中满足给定的正则表达式的一部分”。
文本格式约定:专业术语 特殊代码/语法格式 正则表达式 正则表达式中的一部分(用于分析) 用于在其中搜索的字符串 对正则表达式或其中一部分的说明





