JET'S BLOG

CSS 外边距合并

web@viold.com(JET) — Wed, 10 Feb 2010 16:25:27 GMT

外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。

合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

外边距合并

外边距合并（叠加）是一个相当简单的概念。但是，在实践中对网页进行布局时，它会造成许多混淆。

简单地说，外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

QQREADER84B5ABE97C1A4E6C

当一个元素出现在另一个元素上面时，第一个元素的下外边距与第二个元素的上外边距会发生合并。请看下图

当一个元素包含在另一个元素中时（假设没有内边距或边框把外边距分隔开），它们的上和/或下外边距也会发生合并。请看下图：

尽管看上去有些奇怪，但是外边距甚至可以与自身发生合并。

假设有一个空元素，它有外边距，但是没有边框或填充。在这种情况下，上外边距与下外边距就碰到了一起，它们会发生合并：

如果这个外边距遇到另一个元素的外边距，它还会发生合并：

这就是一系列的段落元素占用空间非常小的原因，因为它们的所有外边距都合并到一起，形成了一个小的外边距。

外边距合并初看上去可能有点奇怪，但是实际上，它是有意义的。以由几个段落组成的典型文本页面为例。第一个段落上面的空间等于段落的上外边距。如果没有外边距合并，后续所有段落之间的外边距都将是相邻上外边距和下外边距的和。这意味着段落之间的空间是页面顶部的两倍。如果发生外边距合并，段落之间的上外边距和下外边距就合并在一起，这样各处的距离就一致了。

注释：只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。

The Skin is BrightDay？！

web@viold.com(JET) — Mon, 01 Feb 2010 02:08:32 GMT

测试环境

分辨率：1024*768 \ 1280*800

浏览器：IE6 \ IE7 \ IE8 \ Chrome \ Opera \ FireFox3

该主题还是和 Lab 系列的一样是采用960网格，瑕疵应该还有不少的，各位童鞋觉得不满意可自行调整或留言告诉我！

点击下载

上个月以来，一直为个项目忙碌不停，博客也荒废了。不过不是没时间，而是晚上空闲下来的时候又跑去玩游戏了，最近几天都在玩 AVA，有没童鞋也玩的？华南一区一起组队去生存玩逃脱。

以上......

道德沦丧的今日：助人烦扰？

web@viold.com(JET) — Fri, 08 Jan 2010 11:36:05 GMT

几年前闹得沸沸扬扬的南京彭宇案，最终虽以二审的和解撤诉而圆满落幕，但是由一审判决结果所引出的人们对司法公正的质疑，以及对于社会道德价值的声讨影响至深。在此之后，类似于“彭宇案”的事件频频见诸于报端，而后又在各种质疑声中收场，就这样一次次地刺激着公众的敏感神经。

令人啼笑皆非的判决书，再现“南京彭宇案”？

2008年8月21日15时14分，原告宋某驾驶自行车自郑州市金水路由北向南行驶至河医立交桥转盘处被被告李凯强驾驶的电动车挂倒受伤。经医院诊断后，由于没有医疗费用遂回家治疗至今。法院认为，李凯强驾驶电动车与宋某驾驶自行车发生交通事故。调查取证认定，无法查证是由李凯强还是宋某其中一方当事人的过错而造成的，根据公平原则，法院认为，原告宋某的损失合理部分由双方各承担50%较妥。因此判决李凯强15日内支付宋某1万元精神抚慰金及其他费用共计7.9万余元。

判决书中所说的根据公平原则，原告宋某的损失合理部分由双方各承担50%较妥。这所谓的判决令人啼笑皆非。这样的判决结果只有一个可能，那就是让受冤者彻底改变对法律的信任，甚至将对受害人的道德准绳扭曲。对真正的受害人来讲，这样的判决难以让人信服。这样的公平原则怎么说得上公平呢？双方各赔偿一半看起来冠冕堂皇，但实质上却是办案不力，模糊定案。相信有严格执法，依据证据而不是单靠推理或所谓的公平原则定案，才能让当事人或广大群众心服口服，同时也可以遏制冤假错案的发生和碰瓷事件的蔓延。该案件双方称已找到目击证人，这起案件究竟结果如何，会否成为2010年河南的又一个“南京彭宇”版。且让我们以事实证据说话，静观其变。

南京彭宇案引发的些许后果

南京彭宇案发生后，当地法院依据“常理分析”断案。致使好心扶起摔倒老太太的市民彭宇被告上法庭，该案件最后在政府出面干预的情况下以双方和解撤诉完结，彭宇最终承担了一万多元。事情的戏剧化发展，不但折射出了社会道德和法律的矛盾。更让人对助人为乐的美德改变了态度，在法制缺陷，道德缺失的同时，助人为乐所付出的代价不菲。

2009年2月22日上午，一位75岁的老人在南京市下关区三汊河公交站台下车时一头栽倒在地，路人很多，但没人敢上前救助，老人为求得帮助，只好大声喊道：“是我自己跌的，和你们无关，你们不用担心！”老人看似幽默的话难道不让我们自我检讨下吗？

于是自己下次果真遇见类似的事件，浮现在心头的第一个念头，往往不再是去学雷锋见义勇为，取而代之的是沉默、冷漠和怯懦。如若社会真的陷入到这种人人自危道德沦陷中，最终受到伤害的将是我们每一个人。也许“学雷锋，做好事”在当今社会已经成为一个笑话了，有的家长甚至教育子女：“到了外面，要低头走路，抬头看天，少管闲事，少找麻烦。”

拾荒老人点燃了道德火炬

2008年4月8日，一位捡破烂的70多岁的老人，摔倒在河北南皮县冯女士的自行车前，自以为有责任的冯女士连忙把老人送到医院检查治疗。没想到，老人第二天找到冯女士的单位，自担摔伤责任并把400元医疗费用退还给冯女士。这是一个温暖助人者例子，在引起社会广泛争议的“彭宇事件后”多少给了乐于助人者些许安慰。

2009 随波逐流

web@viold.com(JET) — Tue, 29 Dec 2009 01:30:44 GMT

2009年，大事不断，小事无数。

广电总局说没有视听许可证就不能提供视频服务，BtChina倒闭了，各大影视论坛急了，纷纷转型只做字幕和影评了。

工信部说没有备案的CN域名要全部收回，个人不得注册CN域名，论坛需要专项备案，又是人仰马翻的场面。

版权问题？扫黄打非？不，我的视线已经不在这边了，只看到CCAV不断的曝光XXX涉黄、XXX没备案违法经营等等，结果CNTV就上线了，而且是没备案那种。

之前因为Chinternet的原因，一直都是在大局域网内偶尔上网找找电视剧、电影之类的消磨时间。现在么，研究翻墙、挖洞越长城，上Twitter，看新闻，让自己的视野更加广阔了，也更加了解这个社会，很感谢广电总局和工信部给我学习的机会，原来你们的扫黄打非行动是逼迫我们翻墙去了解外面的世界更加精彩，暗示我们改用国际域名和空间，赞美你们！

我是文盲：不知道什么是GDP，因为我的工资至今还买不下一套房里面的厕所，一直还在初级阶段，估计一百年不变。

我是法盲：不知道什么是“仙”法、“兴”法，至今在这片土地上只拿出身份证是没用了，因为还需要暂住证，现在改名了—居民证。按照现在事情的发展趋势，估计到2010年，手机实名制、博客实名制、上网许可证这些都会给有关部门举行“听证”后推出吧，一起期待！

2009年网络十大事件（转自天涯社区，谢绝跨省！）。

NO.1 天价烟局长落马网络反腐很遥远

NO.2 “躲猫猫”的不是李荞明

NO.3 “跨省抓捕”与“因言获罪”

NO.4 金钱与权力开道冒名顶替上大学很容易 — 罗彩霞

NO.5 山外青山楼外楼, 西湖飙车几时休 — 杭州欺实马

NO.6 巴东“烈女”的幸与不幸 — 邓玉娇

NO.7 被时代，你最想被怎么样？— 被就业、被增长、被全勤与被代表？

NO.8 有车的司机朋友，你为什么不肯搭载顺路的我？ — 钓鱼执法

NO.9 当见义勇为遇到“不救活人，只捞尸体”

NO.10 每个人都有心目中的大事件，河蟹因素，不讲了，自己翻墙看吧！

圣诞快乐！！

web@viold.com(JET) — Thu, 24 Dec 2009 04:00:00 GMT

愿你享有期望中的全部喜悦,

每一件微小的事物都能带给你甜美的感受和无穷的快乐!

HTML5中"Noreferrer"更好地保证用户浏览的隐私和安全

web@viold.com(JET) — Fri, 11 Dec 2009 04:53:49 GMT

WebKit nightlies 现在支持HTML5中"noreferrer"这个链接属性了，这是一个很小但是很酷的特征，可以让Web开发人员阻止浏览器发送访问来源信息。只要在链接里的把rel属性赋值为"noreferrer"就可以了。

如:<a href=”http://www.viold.com” rel=”noreferrer”>noreferrer!</a>

当接收到了由从某个网页上点击这个链接发起的HTTP请求时，HTTP请求的Referer字段将是空的，这就好像用户在IE浏览器（当然IE目前并不支持HTML5）地址栏直接从about:blank状态开始输入网址并访问网站一样的效果，而网站并不会知道这次访问的来源信息。

当链接中的同时使用 target=”_blank” 时，WebKit同样将会把window.opener属性设为空(null)。对于这个用法的解释是：一个由于点击了网页中锚点而发起的请求，之后目标页面执行的任何脚本应该运行在一个新的上下文环境中，即使这个目标页面通常被认为有着同样的源头。

"noreferrer”这个链接属性值只是HTML5 spec中定义的许多链接属性值的一个。在WebKit中，它是第一个被实现的。其实我们只是希望这样会让那些关心用户隐私和安全的Web开发人员的工作和生活轻松一些。

Google要取消PR了吗？——NO

web@viold.com(JET) — Tue, 24 Nov 2009 08:20:24 GMT

最近几天网上流传了很多这样的信息：Google取消PR，PageRank将成历史。

Google员工苏珊-莫斯克瓦（Susan Moskwa）在Google网站管理员帮助论坛中确认了该消息：

我们一直在告诫网站管理员不应该过分注重PageRank；很多人似乎认为PageRank是衡量网站最重要的指标，这显然是误解。

但一方面我们告诉人们不去关注PageRank值，而另一方面我们却主动提供PageRank数据，我们觉得这样做很愚蠢，因此我们所以撤下了PageRank数据。

Google PR值仅仅在对外公关或者做链接交换时才能体现价值，但通常大多数人会半信半疑，觉得PR既然是Google的专利算法，一定是很影响排名的。但即使PR消失了，要衡量一个网站的权重还是有方法，简单说两个：

一、搜狗Rank
http://www.sogou.com/features/sogourank.html 是用来代替PR的最简单的一个指标。

二、网站外部链接数（重点）
这个数据非常值得关注，PR算法的根本也是外部链接。注意外部链接的质量，友情链接有多少，论坛帖子有多少，垃圾评论有多少……

庆幸的是，一旦Google PageRank消失了，那么那些靠出售假PR链接的网站就无立足之地了，链接交易圈子又清静了不少……

css if endif使用方法

web@viold.com(JET) — Thu, 12 Nov 2009 14:23:34 GMT

不同的浏览器要求不同的样式声明，各浏览器及其各版本有不同程度的 CSS 执行的完整性。采用的是 Internet Explorer 的条件注释语法的思想，并把它内联到 CSS 声明之中。

条件 CSS 主要用于指出一个特别的 CSS 声明是不是应该用于一个特别的浏览器。当然你不希望经常这么做，但是当你需要针对一个浏览器的时候，它会非常有用。可以在U4EA支持列表里看到，大部分的浏览器都支持这种方式。

任意 CSS 声明或者块都可以添加条件声明前缀，这些前缀有3种基本类型：

[if {!} browser]  
[if {!} browser version]  
[if {!} condition browser version]

!                - 声明的否定 (例 NOT) - 可选
browser      - 声明针对的浏览器
IE             - Internet Explorer
Gecko       - Gecko 核心的浏览器 (Firefox, Camino 等)
Webkit     - Webkit 核心的浏览器 (Safari, Shiira 等)
SafMob      - 移动版 Safari (iPhone / iPod Touch)
Opera       - Opera 的浏览器
IEMac       - Mac 版本的 Internet Explorer
Konq         - Konqueror
IEmob       - 移动版 IE
PSP           - Playstation Portable
NetF          - Net Front
version       - 要针对的浏览器版本

实例：

// 条件-CSS 语法实例   
[if IE] - 如果浏览器是 IE   
[if ! Opera] - 如果浏览器不是 Opera   
[if IE 5] - 如果浏览器是 IE 5   
[if lte IE 6] - 如果浏览器是 IE 6 或者更低版本 (IE 5, IE 4 等)   
[if ! gt IE 6] - 和上面的声明等效, 如果浏览器版本不高于 IE 6

// 条件 CSS 盒模型例子   
div.box {   
width: 400px;   
[if IE 5] width: 600px;   
padding: 0 100px;   
}

条件 CSS 可以只维护一个 CSS 文件，而不是好几个需要用到 IE 的条件注释的文件。这有助于流线型维护，也使得代码更加清晰。

再进一步，条件 CSS 的一个重要特性是当它发现一条 @import CSS 声明时，它会自动打开并插入需要导入的文件。这样就减少了页面的加载时间，因为浏览器只需要对 CSS 文件做出一条 HTTP 请求。

近期综合日志 -- 闲人或懒人

web@viold.com(JET) — Mon, 02 Nov 2009 01:16:31 GMT

1.快要换服务器了，最近说查的很严，一个词不当都有可能关服务器，为了不拖累师兄还是趁早找另外个地方安置了。

2.最近很懒，懒得开电脑，更懒得更新博客，不知不觉竟然 PR4，看来不更新的时候 Google 对我更好了？

3.国庆回家耍了耍，才知道几个老同学已经拿了红本子，成为有妇(夫)之夫(妇)了。

4.这周末特地出了下“远门”，跑清远去晾晾自己这快发霉的身体，除了上下班路上，都忘了多久没晒过太阳了。

5.已经没有了春秋，只剩下夏冬，冷空气来的突然，各位童鞋注意保暖啊，别要风度不要命。

以上...

有趣图例:你是一个网页设计师吗?

web@viold.com(JET) — Tue, 20 Oct 2009 04:39:14 GMT

消失蛮久的，出来冒个泡。

随便看看，笑过便好。不管你用PC还是Mac。