分类目录归档：(x)HTML/CSS

HTML5标准废弃 time 标签，转而使用 data 标签

发表于 2011 年 10 月 31 日 由 Sivan

现在我要告诉各位一件非常悲剧的事：HTML5 <time>标签被废弃了，它将由一个更土鳖但是更通用的标签<data>替代。pubdate 属性也一道被废弃了，今后不再有这样一个简单易用的方式去标注内容的发布时间了。

发表在 (x)HTML/CSS | 标签为 | 11 条评论

面向网站设计师和开发人员的超级免费电子书大礼包

发表于 2011 年 10 月 11 日 由 Sivan

WordPress Arena最近整理了非常出色的一些适用于网站设计师和开发人员的免费电子书出来，其中包括《深入浅出HTML与CSS、XHTML》（个人认为最好的重构入门书籍）、《HTML和XHTML权威指南》、《CSS Cookbook》、《Learning PHP 5》等。这些电子书都是正版的，大部分可以直接下载，还有一些在Google Books。推荐感兴趣的朋友看一下。 下载地址：Super Bundle of Free e-books for Web Designers and Developers

发表在 (x)HTML/CSS | 标签为 , | 10 条评论

CSS3版变形金刚

发表于 2011 年 09 月 02 日 由 Sivan

以前做过一个CSS3版忍者神龟，刚才无聊又做了一个变形金刚。 Safari 4+、Chrome、Firefox 5+、Opera 11+以及iOS 4+、Blackberry OS6+、Android都可以看到效果。 演示页面：

发表在 (x)HTML/CSS | 标签为 , | 15 条评论

CSS3 Transform实践：在手机浏览器中缩放iframe

发表于 2011 年 08 月 13 日 由 Sivan

在App每日推送的网站中，我们使用了百度广告管家来控制网站广告的投放。其提供的代码通过js写了一段<iframe>来显示广告，这在电脑以及iPad上是没有问题的，但在手机上的显示却产生了一些问题。 <iframe>框架在手机版网页中的问题 由于App每日推送专门针对iPhone设计了布局，侧栏宽度较原尺寸做了缩小，而iframe代码被固定了宽度，所以在手机中显示成了溢出（如图一）。

发表在 (x)HTML/CSS | 标签为 , , | 2 条评论

慎用section标签

发表于 2011 年 07 月 01 日 由 Sivan

泛滥的<section> 在xhtml构建网页阶段，有一个名词叫“Divtis”（“Div症”），意为重构人员过多地使用了<div>包裹元素：嵌套繁琐或是错误使用（如该用<span>时也用<div>）。随着HTML5的流行，大量“语义化”标签的出现似乎拯救了他们，因为页面总算看起来没有那么多<div>了。

发表在 (x)HTML/CSS | 标签为 | 7 条评论

纯CSS打造的3D效果

发表于 2011 年 04 月 21 日 由 Sivan

http://css-3d.org/space-cube-1.htm CSS 3D网站提供了几个令人振奋的纯CSS实现的3D效果。需使用Safari、iPad或iPhone查看效果，Chrome和Android目前还不行。经测试，Chrome金丝雀版也支持，12.X稳定版还不行。

发表在 (x)HTML/CSS, 前端开发 | 标签为 , | 16 条评论

载入jQuery库的最佳方法

发表于 2011 年 04 月 03 日 由 Sivan

在网站开发的项目中使用Google CDN的jQuery库虽然加载速度很快，但调用本地服务器的库才可以确保万无一失。而使用Wordpress内置jQuery库的话，其末尾防止JS库冲突而加入的jQuery.noConflict()使得主题中所有jQuery代码都要做一些小修改，更可能导致一些插件效果失效。Paul Irish在HTML5 Boilerplate中使用的方法我认为非常不错，分享给大家。

发表在 (x)HTML/CSS, 前端开发 | 标签为 , , | 27 条评论

CSS3版忍者神龟

发表于 2011 年 03 月 23 日 由 Sivan

前几天闲来无事，用CSS3做了一个忍者神龟。搞完无聊，又弄了简单的动画效果。各位看着玩吧，Chrome和Safari下是完整效果 http://lightcss.com/tutorials/turtles/。 就是这个样子了，用圆角和渐变等属性做出静态效果然后加上简单的动画，非常简单。只要有耐心可以绘制更复杂的图像。有时间我会搞一搞。

发表在 (x)HTML/CSS, 前端开发 | 标签为 , , | 15 条评论

投票：我们是否需要为所有浏览器添加条件注释？

发表于 2011 年 03 月 20 日 由 Sivan

CSS-Tricks最近发起了一个投票：我们是否需要为所有浏览器（目前仅IE支持）添加条件注释，就像下面这样： <!--[if Fx 3.6]> <link rel="stylesheet" href="firefox-v3.6.css"> <![endif]--> 投票在原文的侧栏http://css-tricks.com/new-poll-conditional-tags-for-all-browsers/ 我认为浏览器对网页的表现应该向统一的方向发展，既不会让访客感到迷惑，又可以降低前端开发的成本，此举没必要。

发表在 (x)HTML/CSS, 前端开发 | 标签为 , | 3 条评论

网页重构中区分IE6、IE7、IE8及标准浏览器的最佳方法

发表于 2011 年 03 月 14 日 由 Sivan

写在前面 由于万恶的IE（尤其指IE6和IE7），我们在页面重构时不免要对其进行各种bug修复及差异化处理。在标准浏览器[1]中可实现的效果在IE里却有各种离奇问题，例如IE6、IE7不能良好应对的inline-block和.clearfix问题，好在大部分问题已经有了足够的总结和途径。废话不多说，下面是一些方法区分浏览器的方法和我的看法。

发表在 (x)HTML/CSS, 前端开发 | 标签为 , , | 7 条评论