国外牛人用CSS3画了个iphone，只支持webkit browser，windows用户可以用chrome看效果。 很牛，还有动态效果。看来以后CSS3和flash之间的战斗会越来越火热。 浏览地址：http://demos.jeffbatterton.com/iphone-css3/

端午3天长假，和朋友几个去了次同里。照的相片不多，感觉商业化太浓的同时整体规划还是差了点，水乡的宁静有点变味了。不过对于上海这么近的地方来说，已经算是很不错了。 里面的景点怎么说呢，有兴趣就看看吧。主要还是来享受下水乡的宁静悠闲，至于说景点这类的园林建筑，喜欢就去看，不看也行。在这里坐小船，吃点本地特色菜，在水边看书，闲聊，发呆也是个不错的打发时间的好点子。谈到休闲，这里还是不及四川哈哈：）。

翻译下一篇国外的文章: 目前，在web design行业我们很难在主流几个浏览器里做到显示完全一致的效果。有的还认为这种完美的兼容是没有必要的。 当然，我同意构建一个为每个用户每个浏览器考虑的方案（移动终端除外）是不会出现在每个我们遇到的项目上面的。但我相信一个能给出一个跨浏览器兼容方案。作为一个开发人员，我们的目标不只是为了让这个项目在每个浏览器上能跑；我们的目标是项目能兼容全部浏览器的同时，代码更加精简，未来更好维护。 在这片文章中，我会写到一些我认为很重要的CSS法则和贴士，帮助新手和老手开发出精炼高效的CSS代码。 了解CSS box 模式 如果你想写出比较少用到hack类的跨浏览器兼容CSS，这是第一个你必须掌握娴熟的。还好，box模式不是很难掌握，而且基本上很多浏览器的解析是一样的，除了万恶的IE6之类的…… css的box模式是负责计算的： 有多少空间被块元素占用 是否有border， margin 重叠，或者溢出 box 大小 在有些范围内，一个box 的相对定位 css的box模式基本规则： box 都是方的！ 块状化(block)元素，的大小是由 width，height，padding，borders，margins 一起决定的 如果块元素没有指定高度，那么他的高度是内容加上边距（除非有浮动情况） 如果块元素的宽度没指定，那么一个没有浮动的块元素会扩展到父级宽度减去父级的padding 一些必须记住的块状化元素准则： 如果一个box 指定宽度是100%。别去写margin padding border，否则会溢出的 两个相邻的垂直margin，会搞出一些神奇问题（什么重合崩溃之类） 相对定位，绝对定位是有差异的，这个后面章节再说 明白Block块状和Inline内联状容器的区别： 对于一个熟手来说，这另外一个显而易见无脑流的东西。然而，这也是另外一个很重要的领域。当完全了解后，就能容易开发出兼容浏览器的css代码。 下面的图片说明了block和inline元素的区别： 以下是一些区分两者的基本原则： block 元素默认状态下是自动扩展到父级元素的大小，因此没有必要width:100% block元素默认状态下是在父级元素里面的右边顶格排列的.并且低于以前的block元素.(除非是有浮动,和其他定位) inline 元素会忽略 宽度高度设定 inline 元素 遵循text特性 inline 元素能用 垂直剧中，而block不能用 inline 元素有些自然空间留白，比如为了配合”g”这种字母下面的勾 如果inline元素浮动，那么就变成了block元素 了解浮动和清楚浮动 对于多列的布局，最好的方法就是使用浮动。因此，了解浮动原理是另外一个实现跨浏览器css的重要部分。 一个浮动元素可以左浮动和右浮动，最后会浮动到他的父级边缘，或者另外一个浮动元素的边上。所有在浮动元素后出现的不浮动的，inline内容会围绕浮动元素。 [...]

这小两口在玩青春剧。 这张是我觉得最有感觉的照片。满上镜的！ 附加几张也在世纪公园的model：