层叠样式表（CSS）是现代网站设计非常重要的组成部分，如果没有它，那网站就会像10年前那样难看。随着时间的推移，在网络上的CSS教程的质量有了大幅度提高。这里有21个令人称赞的CSS技术应用实例，您可能从来没想过这些也能够通过CSS来实现。

1、跨浏览器的CSS幻灯片

这是一个只用CSS技术实现的跨浏览器图库的精彩范例。

2、基于CSS技术的图片热区

本实例用让人着迷的方式演示了一个仅仅用CSS技术来实现的图像热区效果

3.不需要JavaScript纯CSS的 LightBox

创建一个无js纯CSS的lighbox。

4。图像替代按钮

通过CSS方式用图片代替提交按钮，避免在CSS不起作用时返回提交按钮

用CSS实现动画导航菜单

非常棒的实例教程教你如何创建一个纯CSS的动画导航菜单。

6。用CSS实现树形导航

创建一个多层级列表树型导航栏。非常适合创建站点导航。

7.CSS实现的渐变文字效果

用css实现一个吸引眼球的渐变效果标题。

8。用CSS设计菜单列表

这个实例让你很容易知道如何使用CSS来实现一个既有边框风格也有背景图像属性的菜单列表，

9。实现带有压缩边距流动式布局

这是一个用意想不到的方法来实现的一个压缩边距流动式布局的实例。

10。使用CSS让您的页脚固定在底部

也许你会遇到没有足够的内容来填满整个页面情况，这种情况时，页脚也会跟着向上移。本实例告诉你如何处理这问题，在内容即使不够的情况下使页脚留在底部。

11。基于CSS的简单，可扩展的Tab式位置导航

实现一个可扩展的Tab式位置导航实例

12。为您的博客添加Pullquotes

将您的需要强调的部分从文章内容中或博客帖子中挑出。在很长内容中作重点突出。这个非常实用。

13.CSS的柱形条形图

告诉您如何在网站上用CSS实现柱形图形，不需要任何重量级的插件和任何JavaScript代码。

14.如何实现一个超链接列表悬停效果

15。多列列表

这篇文章告诉你使用多种可能的方法堆叠成一个多列无序列表。

16。日期显示插件

如果你曾经访问过“学习jQuery”的网站 ，那么你可能早已发现到每个博客帖子旁边有个非常棒的日期显示模块。本教程将告诉你如何使用这个CSS组件来实现这样的效果。

17。为您的博客添加日期图标和气泡式评论

在您的博客巧妙的显示日期和您的评论，为您的博客省下空间。

18。如何巧妙的实现一个CSS图像浏览器

使用CSS实现一个不错的图像浏览器，即使用户已禁用浏览器的JavaScript和flash也能够很好的显示。

19。实现一个CSS图像预加载功能

不需要任何JS仅用CSS的背景图像属性实现图像预加载功能。

20。淡出底部页面

本教程向您介绍如何让网页内容在页面底部淡出。就像fortuito.us博客这样。

21.创意而又酷的CSS边框属性

本文介绍如何在CSS的边框属性来实现一些很酷的效果。你会惊讶CSS边框居然能这么酷。

原文：http://www.iwanna.cn/archives/2010/08/09/4867/

本文来自: 21个超赞的CSS实现技术应用实例

您或许也会喜欢：

时尚的CSS3进度条(0)

瀑布布局的JavaScript实现方式(0)

抛弃 CSS Hacks 后的浏览器兼容方案(0)

分享16个优秀的 CSS3 表单开发教程(0)

8个应该了解的CSS3技术 (0)

Chosen：Select选择框的华丽变身(0)

前端设计中的浏览器CSS Hack汇总(0)

三十款CSS样式选择器代码(0)

CSS 忍者：安全的 CSS hacks 秘籍(0)

用面包屑来简化多层的tabs(0)