50个最实用的CSS技巧 样式欣赏 - 业内资讯 - CHINAUI.com 优艾网 - 中国人机界面设计门户网站
您的位置:首页 >> 资讯 >> 界面新看台 >> 50个最实用的CSS技巧 样式欣赏
50个最实用的CSS技巧 样式欣赏
来源:Chinaui 作者:Chinaui 发布时间:2008-04-16

开发一个有独具创意的网站样式设计是一件非常辛苦的事,尤其是撰写编码需要花很多时间和精力解决许多遇到的不协调问题和寻找一些可能会遇到问题,这里收集了过去一年里常用的50个最实用的CSS -技巧。

感谢一切为CSS设计发展作出贡献的人。(via)

50个CSS技巧

1. Triadic Background Setting with CSS
The Silverback web site uses three background images to create the illusion of 3D with simple CSS. No documentation is provided, however the source code is quite intuitive. [via Wilson Miner]

CSS-Technique

2. Creative Use of PNG Transparency in Web Design
With proper PNG support in Internet Explorer 7, and some handy JavaScript and CSS tricks to account for older browsers, we can use PNG images to greatly enhance our design vocabulary.

CSS-Technique

3. CSS Server-Side Pre-Processor

CSS-Technique

4. Advanced CSS Menu

CSS-techniques - Advanced CSS Menu

5. CSS SiteMap

CSS-techniques - beTech » CSS SiteMap » Oct 3, 2007

6. Styling File Inputs with CSS and the DOM
File inputs (<input type=”file” />) are the bane of beautiful form design. No rendering engine provides the granular control over their presentation designers desire. This simple, three-part progressive enhancement provides the markup, CSS, and JavaScript to address the long-standing irritation.

CSS-Technique

7. A Savvy Approach to Copyright Messaging
Derek Powazek suggests adding a copyright message to a photo and use CSS to crop its view. This is supposed to accomplish the goal of adding robust copyright information without defacing your own work.

Screenshot

8. Particletree Category List

CSS-techniques - Particletree » Automatically Version Your CSS and JavaScript Files

9. Advanced CSS Menu Trick
What we want to do here, is instead of simply altering the state of the navigation item the user is currently rolling over, we want to alter the non navigation items as well.

Screenshot

10. CSS hover effect

CSS-techniques - CSS hover effect | Veerle's blog

相关阅读
推荐文章
热点文章