在如今大屏幕日趋流行的今天,相当多的网站都喜欢用大图片来当背景,但是这也有个问题,小屏幕浏览图片显示不全,大屏幕浏览却不够,如何才能对图片进行缩放呢?
其实在CSS3中有个background-size属性,不过现在基本上没啥浏览器能支持,不过了解下也不错,在W3C中有对它有定义到,可以在这里看详细用法。
当然熟悉AS的朋友也可以用整站flash很容易的实现,本文讨论的是基于css来实现。
在如今大屏幕日趋流行的今天,相当多的网站都喜欢用大图片来当背景,但是这也有个问题,小屏幕浏览图片显示不全,大屏幕浏览却不够,如何才能对图片进行缩放呢?
其实在CSS3中有个background-size属性,不过现在基本上没啥浏览器能支持,不过了解下也不错,在W3C中有对它有定义到,可以在这里看详细用法。
当然熟悉AS的朋友也可以用整站flash很容易的实现,本文讨论的是基于css来实现。
这是一个简单而且实用的小技巧,至少我只这么觉得的:)。最早好像是是在DOM Scripting 里面看到的。好吧,废话不说了,直接上代码好好享用。
比如导航栏的XHTML代码是这样的:
<ul id="nav">
<li><a href="#">home</a></li>
<li><a href="#">about</a></li>
<li><a href="#">contact</a></li>
</ul>
那么如何才能凸显当前页面的呢?给当前页面的链接加个class,然后通过CSS来控制其显示样式,这样行为和表现分开了,以后更改也方便。 continue reading…
如果你对标题感到了深深的疑惑,来这里(优化网站速度的几种方式)看看先:-)
首先要补充解释下一个叫“性能黄金法则”的东东:
只有10%~20%的最终用户响应时间花在了下载HTML文档上。其余的80%~90%时间花在了下载页面中的所有组件上。
这里说的组件就是网站中的图片,CSS和脚本等等。所有着重优化的地方就在这些组件上面了。
其实叫栅格系统还是网格系统(Grid System)也没有明确的说明,早些看到一些关于栅格设计的文章,不过理论性偏强,不太容易理解,自己很早就想写篇相关文章,不过前几天去了灾区,所以就拖到现在了。我还喜欢从实际的例子中来了解,如果你对栅格有了初步了解可以直接跳至下面,那里有延续阅读,链接到众多业界人对栅格系统设计的理解。
去年5月12号的汶川大地震依然记忆犹新,毗邻灾区,很早就打算在一周年祭的时候进行一次特别的旅行,亲自到灾区去看看,感受他们一年后的生活。行程从成都开始,5月11号出发,历时三天。