很不错的 CSS Hack

CSS Hack
height:20px; /*For Firefox*/
*height:25px; /*For IE7 & IE6*/
_height:20px; /*For IE6*/

今天学到了一手,效果不错,哇卡卡卡卡

Tags: css

分类:Web Design | 固定链接 | 评论: 16 | 引用: 0 | 查看次数: 12888

被Flash 9.0强奸了~~~~

这是一段FlashPlayer 9自动在页面上面生成的 js 代码. 但是这段代码很容易造成ie死循环~~~
好无言啊. 居然连基本的纠错都没有. 不知道 adobe 如何考虑这个问题的.

function __flash_unloadHandler() {
  custom_menu.style.display = 'none';
  for (var prop in custom_menu) {
    if (typeof(custom_menu[prop]) == "function") {
      custom_menu[prop]=null;
    }
  }
  if (__flash_savedUnloadHandler != null) {
    __flash_savedUnloadHandler();
  }
}
function __flash_setupUnloadHandler() {
  if (window.onunload != __flash_unloadHandler) {
    __flash_savedUnloadHandler = window.onunload;
    window.onunload = __flash_unloadHandler;
  }
}
__flash_setupUnloadHandler();

查看更多...

分类:Web Design | 固定链接 | 评论: 12 | 引用: 0 | 查看次数: 23518

继续用marquee实现loading

其实 marquee 是个好东西啊. 利用它可以实现不少loading的样式. 嘿嘿,自己想象吧.
HTML代码


[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

查看更多...

分类:Web Design | 固定链接 | 评论: 13 | 引用: 0 | 查看次数: 10783

首届CSS世界大赛获奖作品欣赏

  首届CSS世界大赛(The first CSS World Awards)由CSS Mania网站举办。活动时间从2005年5月到2006年5月,为时一年。比赛的目的是认可使用CSS建站的开发者们完成的作品以及提高企业使用Web标准的意识。比赛作品分为十类,它们分别是:Site of the Year(年度站点),Associations(协会),Blogging(博客),Business(商务),Entertainment(娱乐),Institutions(社团),Media(媒体),Portal(门户),Web Design(Web设计),Web Tools(Web工具)。

  由于大赛目的不是获利,而是对Web开发者使用CSS和XHTML进行工作的认可,因此奖品看起来更多是的精神奖励:每类作品的第一名优胜者将获得一件T-shirt,一份Crazy Egg授权。“年度站点”的每个获奖者则可以从三本CSS书籍中挑选一本作为奖励。

官方地址: http://awards.cssmania.com/2006/07/07/css-world-awards-winners-2006.php

查看更多...

Tags: css

分类:Web Design | 固定链接 | 评论: 5 | 引用: 2 | 查看次数: 21017

利用JS+CSS实现圆角

为了不用图片实现圆角已经不是一天两天的事情了,IE迟迟不支持CSS3.0 如果要普及3.0估计还得好多年. 但是程序界狂人辈出啊.看看以下的实现方法吧. 呵呵.

查看更多...

Tags: css

分类:Web Design | 固定链接 | 评论: 14 | 引用: 0 | 查看次数: 15632

Firefox 不能用样式支持webdings字体

同事今天问到我一个关于FF字体的问题. 他设置的webdings字体在FF下面无效.

<font face="webdings">97<4;8:</font><br/>
<font style="font-family:webdings">97<4;8:</font>


不过我的电脑测试用 font face="webdings" FF可以使用这个字体了,但是同事的电脑里的FF还是无法使用该字体.

发现同事无法使用的原因 他的页面使用了XHTML 1.0过渡定义. 这样 font face="webdings" 也就完全无效了

具体问题,继续去查查官方的说明....

查看更多...

分类:Web Design | 固定链接 | 评论: 16 | 引用: 0 | 查看次数: 16494

我的CSS心得(5) - 让文字自动适应Table宽度

以下的例子是用样式实现,文字自动适应Table的宽度,并且超出的宽度的文字自动隐藏。IE下面还可以自动出现...的省略符号.

所用到的样式:
.ctl{
table-layout:fixed
}
.ctl td{text-overflow:ellipsis;overflow:hidden;white-space: nowrap;padding:2px}


关键样式:
table-layout:fixed 固定布局的算法,则表格被呈递的默认宽度为 100% (For IE,Mozilla)
text-overflow:ellipsis 当对象内文本溢出时显示省略标记(...) (For IE)
overflow:hidden 不显示超过对象尺寸的内容 (For IE,Mozilla)
white-space: nowrap 强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象 (For IE,Mozilla)

演示:

查看更多...

Tags: css

分类:Web Design | 固定链接 | 评论: 6 | 引用: 7 | 查看次数: 24210

从GMail认识的W3C网页标准和Ajax

文章献给,目前还在苦苦研究W3C和Ajax的朋友。

  不可否认,W3C网页标准刚出来的时候的确很吸引人。那时因为firefox的出现,冲击了浏览器市场,使得大家为了一个小狐狸,而掀起一场网页标准的风波,但是对于设计师来说带来什么?在这场风波我看到的最多就是技术的泛滥。
  和一些designer聊天,第一句话就问,“你的网页标准化了”吗,“你的网页又有几处错误”。无形中这些话就给我们这些designer来说带来很大压力。每次更新网页都很害怕因为一些小小的改动导致一些小错误。似乎W3C成了一种追捧现象。就如同前段时间的Ajax热一样。但我们更加是应该理性分析,我们什么时候才应该用到这些技术......

注意本站原创文章,转载请注明出处

查看更多...

Tags: W3C Ajax GMail

分类:Web Design | 固定链接 | 评论: 32 | 引用: 13 | 查看次数: 23679

再说word-break: break-all;

今天网友 Dcboy 和我提到一个Bug,他说他的编辑框变形了。后来我看了他的代码发现编辑框没有自动换行。被文章中的英文撑开了。

于是我告诉他,让他在skin的CSS里加上 word-break: break-all; 问题解决了。这个问题只有IE才有,我在FF下测试,FF可以自己加滚动条,这样也不影响效果

建议大家做Skin时,记得在body里加 word-break: break-all; 这样可以解决IE的框架被英文撑开的问题

以下引用word-break的说明, 注意word-break 是IE5+专有属性

查看更多...

Tags: css skin

分类:Web Design | 固定链接 | 评论: 21 | 引用: 4 | 查看次数: 21027

FCKeditor 发表日志的Bug

之前有朋友说用FCKeditor发表日志,有时会失效.我也测试出来了这个Bug了. 这个是 FCKeditor 的 Bug.现在说一下这个产生Bug的方法.希望以后大家用这个编辑器的时候注意一下

一般用这个编辑器产生Bug都是转贴的时候产生的. 就是说在复制过来的时候就出现了. 以下情况都可能出现这个Bug.
1. 直接复制粘贴文章马上提交,这个几率不大。
2.在FCKeditor全选文章,或有选择块的时候,提交前 FCKeditor 会把所选的内容清除... (好奇怪的做法)

解决办法,复制内容后,随意编辑一下,提交前不要选择任何文字。
分类:Web Design | 固定链接 | 评论: 1 | 引用: 0 | 查看次数: 9584