如果你对 CSS 的掌握已经到了一定的贯通程度,那么你手中的 CSS 将会为你做很多高级的功能,甚至有时候 CSS 可以帮助解决之前靠 JS 才能解决的问题, 要知道,在 Web 开发过程中, 减少一段 JS 可是对 Web 的运行有足够大的减压作用的。25个 CSS 高级教程，让你更了解 CSS。

1. 纯 CSS 字体渐变和背景渐变

CSS Gradients using pure CSS

Background gradients and CSS

CSS Gradient Text Effect

Pure CSS Text Gradient

2. Z-Index 图像重叠

Understading Z-Index

CSS Z-index

3. CSS 边框创意

Create a Scalable Star using using CSS border

Border Slants

4. 超酷 CSS 效果 - 控制面板

Dashboard

5. 纯 CSS 创建 2D/3D 按钮

3D Rollover Button using CSS

How to make sexy buttons with CSS

CSS rollover buttons

6. 文字凹凸/阴影技术

view plaincopy to clipboardprint?

Text Embossing

CSS Text Drop Shadows

1. text-shadow: 0px 1px 0px #e5e5ee;

7. 小图标式链接

Add icon to the hyperlink.

Iconize Textlinks with CSS

8. CSS 内容引用

Curly Quotes with Pure CSS

Swooshy Curly Quotes Without Images

9. CSS半透明式炫酷特效

A CSS only fly-out menu with transparency

CSS Menu using CSS opacity property

Opacity Background Blending Effects

Transparency Menu Watermark on an image

10. 背景模糊效果

how to create a blurry background using CSS

11. css视差效果

Examples of and How to Create the CSS Parallax Effect

A parallax illusion with CSS: The Horse in Motion

12.纯css的Lightbox特效(服了吧O(∩_∩)O哈哈~)

13.纯css滑动门（手风琴）效果

create Accordion using CSS

14. 垃圾背景样式的文字效果（与1相似）

tutorial

 

 

15.创建块悬停/元悬停效果

Learn how to create a block hover effect for a list of links

CSS element hover effect.

16. 简单的文字渐变特效（与1类似）

dither effect using

17. 创建一个导航（“官方”称之为：liDock Menu）

Horizontal Menus That Grow on You

18. 链接图片（图像）翻转

CSS swap hover effect

19. 纯css的宝丽来特效

 

Polaroid-izing photos with CSS and one Image.

20. CSS 杂志

Create a Magazine Type layout Using CSS

21. CSS的Hoverbox Menu效果

cool CSS Menu

22.CSS 标签切换

Create a Tabbed content.

23.CSS固定背景附着特效

shows a trick that reveals a magic

24. CSS 信息提示

Show a message when hovering over the links.

25. 纯 CSS 预加载效果

Add a “loading” icon to your larger images

想收藏或者和大家分享这篇好文章→

相关阅读：

• 纯css实现的尖角框
• js+css实现的彩色渐变文字特效
• css hack技巧/技术集锦
• div+css制作网页经验技巧集锦
• js+css实现的自定义浏览器滚动条

Tags: css css高级技术 css特效 |Comments:(3)|read:(438)

This entry was posted on August 3rd, 2009 and is filed under web前端开发 .You can follow any responses to this entry through the rss2 feed.You can leave a response, or trackback from your own site.