Allen 2009-08-08 09:39:38 16597 1 0 0 0

 (转自TAOGOGO,原文地址:http://www.taogogo.info/2009_08_3_54032.html,保存一下,便于学习~~)

如果你对 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 边框创意

 

border

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 标签切换

css_tab

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


【版權聲明】
本文爲原創,遵循CC 4.0 BY-SA版權協議!轉載時請附上原文鏈接及本聲明。
原文鏈接:https://tdlib.com/am.php?t=8yyXnxI1D8jw
Tag: CSS 网页编程 TTTBLOG
我也要發一個   ·   返回首頁   ·   返回[Html]   ·   前一個   ·   下一個
評論
Allen#1Allen 2009-08-08 16:25:14(N) 鏈接地址
| 130 | zwwooooo | 2009-08-08 16:25:14 | [email protected] | http://zwwooooo.com |
-----
很炫,但懒得学啊[REVERT=taoether 于 2009-8-9 21:38:03 回复]呵呵,彼此彼此~~[/REVERT]
頂部     1/1 
歡迎評論
未登錄,
請先 [ 註冊 ] or [ 登錄 ]
(一分鍾即可完成註冊!)
返回首頁     ·   返回[Html]   ·   返回頂部