首页 > 开发 > CSS > 正文

收集国外网站的25个CSS高级教程

2024-07-11 09:04:35
字体:
来源:转载
供稿:网友

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

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

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

收集国外网站的25个CSS高级教程

CSS Gradients using pure CSS

Background gradients and CSS

收集国外网站的25个CSS高级教程

CSS Gradient Text Effect

Pure CSS Text Gradient

2. Z-Index 图像重叠

收集国外网站的25个CSS高级教程

Understading Z-Index

CSS Z-index

3. CSS 边框创意

收集国外网站的25个CSS高级教程

Create a Scalable Star using using CSS border

Border Slants

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

收集国外网站的25个CSS高级教程

Dashboard

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

收集国外网站的25个CSS高级教程

3D Rollover Button using CSS

How to make sexy buttons with CSS

CSS rollover buttons

6. Text Embossing/Shadow Technique With CSS

Text Embossing

CSS Text Drop Shadows

1. text-shadow: 0px 1px 0px #e5e5ee;7. Iconize Text links/Hyperlink with CSS

收集国外网站的25个CSS高级教程

Add icon to the hyperlink.

Iconize Textlinks with CSS

8. CSS Curly Quotes

收集国外网站的25个CSS高级教程

Curly Quotes with Pure CSS

Swooshy Curly Quotes Without Images

9. Using CSS Opacity for Various Cool Effects

收集国外网站的25个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. Blurry Background Effect

收集国外网站的25个CSS高级教程

how to create a blurry background using CSS

11. CSS Parallax Effect

收集国外网站的25个CSS高级教程

Examples of and How to Create the CSS Parallax Effect

A parallax illusion with CSS: The Horse in Motion

12.Create a Lightbox effect only with CSS

收集国外网站的25个CSS高级教程

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表