Jan
08
使用 html5 的 doctype 代替很长很长的 xhtml doctype 似乎成了时尚和趋势，只需写寥寥几个字符：
<!DOCTYPE html>
简单易用，而且兼容性又不错，不过毕竟IE7和IE6还是不认识它，就会出问题…
Dec
29
dotted和dashed是几个Border-style类型里面最常用又是最容易被混淆的，从字面上我们可以知道dotted代表点线，dashed代表虚线，不过是怎样的点线和虚线，我们无从得知。W3C也仅仅是从字面上对这两者进行了定义和解释，如同讲废话一样将解释权踢给了各浏览器开发商。浏览器混乱的给出自己的解释，其中“造就”的罪过，最终降临在WEB开发者身上…
Jul
23
tabindex 可以定义 HTML 元素的 tab 键选择顺序，默认不设置值，所以文档中的元素都是按照排列顺序选择的。
<!--缺省情况与tabindex="0"相同，此时按照顺序选择-->
<input type="text" name="" value="缺省" />
<input type="text" name="" tabindex="0" value="tabindex=0" />
<!--设置tabindex的值为1到32767，则按序号从小到大顺序选择-->
<input type="text" name="" tabindex="3" value="tabindex=3" />
<input type="text" name="" tabindex="2" value="tabindex=2" />
<input type="text" name="" tabindex="1" value="tabindex=1" />
<!--设为-1就可以禁用tab选中-->
<input type="text" name="" tabindex="-1" value="tabindex=-1" />
Mar
24
貌似有点火星了，前几天朋友找我抓个错误，HTML 结构很简单，我模拟一下^_^
<div class="wrap">
<div class="content">
1111
</div>
</div>
CSS 样式也很简单，我再模拟一下o(∩_∩)o…
[code=css]
body{
background:#000;
margin:0;
padding:0;
}
.wrap{
height:300px;
background:#f1f1f1;
}
.content{
height:50px;
background:#36c;
margin-top:100px;
}
[/code]
本意是要让content和wrap之间有100像素的外边距，HTML 结构和 CSS 貌似都完美的呈现了这个结果。 然而在FF里却完全不是这么回事:示例
Mar
05
发现豆瓣的头像裁切组件在 IE 下报错，换了 Chrome 才搞定。希望这是他们有意在抵制 IE！o(∩_∩)o…哈哈。正好想起了前辈们正在进行的一项计划，如果你也有一样的想法，就一起参与吧！！！
Drop ie6
让我们一起来抵制 IE 吧，Oh,应该是 IE6,为拯救前端开发工程师的生命，请放弃 IE6！
Twitter:http://twitter.com/dropie6
Website:http://dropie6.org/
Mar
04
我们经常会为了达到某一共有的表现，定义一个通用的样式，比如<例1>
例1：
假设我们规定了用红色代表警告，于是定义
.red{color:#f00;}
表示红色前景色，在需要用到这个表现的时候我们就可以给相应元素添加这个 class.
<div class="red">红色字体</div>
这样做的好处是灵活、通用、而且省了很多麻烦。不过我们是否能够想到它的坏处是什么呢，想想 W3C 为什么不建议使用 <font>、<i>和 <b>标签吧;因为他们是纯表现的标签，没有任何语义。在看这个加上.red的 div，是否觉得它没有任何语义呢（除了知道这个 DIV 的前景色是红色，其他我们一无所知）！这么做其实等于我们自己创造了一个毫无语义的 <c> 或 <d> 标签。
Jan
05
最近冷的人的思维也跟着迟钝了，下班回家只想早早地钻进被窝，即使想写点什么也懒得动手，我的 BLOG 就这样冷清了=.=!
不过，我发现利用上班时间写博是个好主意，哇哈哈~~~
前两天和朋友们一起讨论 CSS Zen Garden ，嗯，说真的， Zen Garden 给我的印象很淡，还记得刚接触 Zen Garden 的时候，已经有人把她夸的天花乱坠，这其中当然是新手居多，同为新手的我貌似还看不出什么门道，除了敬仰就是漠然，于是后面就再也没有看过。现在回想起来只觉得 Zen Garden 内作品甚多，千姿百态！设计师的功力和 CSS 的强大可见一斑。
Dec
27
熟悉WEB开发的朋友都明白一个现状：想在网页上显示一种字体，该字体文件本身必须存在于用户的电脑中，由于这个限制，加上 Web 用户可能分散于各种操作系统，只有那些在各种环境都普遍存在的字体才会被用于网页。
目前各种操作系统默认安装的英文字体有 arial、verdana、tahoma 等多种字体，而中文字体仅有宋体、黑体。因此也就限定了中文用户只能用宋体或黑体去浏览网页。对于设计稿中多彩多样的字体，Web 设计师也只能采用图片的形式展现给用户。
然而Web中的动态文字是无法用图片来实现的，设计师在给文字加上样式的同时更多的是在祈祷用户安装了相应的字体。
.yahei{font-family:"微软雅黑",verdana,airal;}
设计师为文字设定了以上样式，如果用户的系统中没有安装微软雅黑，最终呈现在用户面前的中文文字将会是默认字体，正如我Blog的标题样式：
如果你看到的文章标题不是雅黑的字型，说明你的系统没有安装微软雅黑这个字体。
CSS 可能为这个问题带来一线曙光，CSS 包含一个 @font-face 定义，你可以指定一种位于某个 Web 服务器上的 TrueType 或 OpenType 字体。
@font-face {
font-family: "Kimberley";
src: url(http://www.princexml.com/fonts/larabie/kimberle.ttf) format("truetype");
}
h1 { font-family: "Kimberley", sans-serif }
Safari, Firefox 3.1,Opera最新版目前均支持 @font-face定义。这三种浏览器目前覆盖了30%~50%的用户，对 Web 设计者来说，这个数字已经足够大。至于 IE 浏览器，虽然微软从IE4开始就宣称支持Web 字体定义，但就目前而言，也只限于Embedded OpenType(EOT)文件，所以我们必须为IE用户定义一个私有的stylesheet。
Dec
18
一般情况下CSS优先级遵循以下规则：
[1位重要标志位] > [4位特殊性标志] > 声明先后顺序
说明：css2用3位特殊性标志，css2.1以后用4位。
1位重要标志位指的是!important声明，使用!important可以改变优先级别为最高，其次是style对象，然后是id > class >tag ，另外在同级样式按照申明的顺序后出现的样式具有高优先级。
