中国设计联盟
联网
Dreamweaver Flash Photoshop 其它周边 web标准 asp php .net CSS WAP网站攻略 专题
网站建设 域名注册 网站建设 虚拟主机 广州网站设计 域名注册 广州网站建设 上海网站建设 虚拟主机 广州网页设计  虚拟主机 域名注册 acg王国 ACG玩家
求创科技
网站建设
中国福网
中国互联
艺魂宝库网
时代网
招聘求职
中资源
当前位置:网络学院首页 >> 设计教程 >> web标准 >> 53个CSS-不可或缺的技巧

53个CSS-不可或缺的技巧 (1)

来源:中国设计秀    作者:    点击:1171     加入收藏
关键字:技巧 css WEB标准
53个CSS-不可或缺的技巧
Quote:
CSS is important. And it is being used more and more often. Cascading Style Sheets offer many advantages you don’t have in table-layouts - and first of all a strict separation between layout, or design of the page, and the information, presented on the page. Thus the design of pages can be easily changed, just replacing a css-file with another one. Isn’t it great? Well, actualy, it is.

CSS是重要的,它正在越来越广泛的被运用。层叠样式表拥有很多表格布局所没有的优势,首先从布局或者页面的设计与出现在页面中的信息中作严格的分离,从而让页面的设计能够很容易被改变,仅用一个CSS文件更换另一个。难道它不够强大吗?恩,是的,其实它很强大。

Quote:
Over the last few years web-developers have written many articles about CSS and developed many useful techniques, which can save you a lot of time - of course, if you are able to find them in time. Below you’ll find a list of techniques we , as web-architects, really couldn’t live without. They are essential and they indeed make our life easier. Let’s take a look at 53 CSS-based techniques you should always have ready to hand if you develop web-sites.

在过去的几年里,网站开发者写了很多关于CSS的文章和开发了很多实用的技巧,这些能帮你节省很多时间。当然,如果你有足够时间也可能发现它们。在下面,你将会发现我们作为网站架构师真正不可或缺的技巧目录。它们确实是必要的,它们使我们的生活更简单。让我们看一看这53个基于CSS的技巧,如果你做网站开发,应该永远都愿意掌握它们。
Quote:
Thanks to all developers who contributed to accessible and usable css-based design over the last few years. We really appreciate it. Thanks!
感谢所有的在过去几年里在易用和可用的基于CSS设计方面作出贡献的开发者们,我们真的很感谢他们!谢谢你们!

1. CSS Based Navigation //基于CSS的导航

Please click to zoom in!


2. Navigation Matrix Reloaded //导航矩块翻转

Please click to zoom in!


3. CSS Tabs //CSS标签

Please click to zoom in!


4. CSS Bar Graphs //CSS条状图表

Please click to zoom in!


5. Collapsing Tables: An Example //压缩表格:一个实例

Please click to zoom in!


6. Adam’s Radio & Checkbox Customisation Method //亚当的单选框和复选框的用户化方法

Please click to zoom in!


7. CSS Image Replacement //CSS图像替代

Please click to zoom in!


8. CSS Shadows(CSS Shadows Roundup) //CSS阴影(CSS阴影综述)

Please click to zoom in!


9. CSS Rounded Corners Roundup (Nifty Corners) //CSS圆角综述(漂亮的拐角)

Please click to zoom in!


10. Drop Cap-Capital Letters with CSS //用CSS实现首字母下沉

Please click to zoom in!


11. Define Image Opacity with CSS //用CSS定义图像半透明

Please click to zoom in!


12. How to Create a Block Hover Effect for a List of Links //如何给链接列表创建鼠标悬停的区块效果

Please click to zoom in!


13. Pullquotes with CSS (Automatic Pullquotes with JavaScript and CSS) //用CSS实现引用(用JavaScript和CSS实现自动引用)

Please click to zoom in!


14. CSS Diagrams //CSS图表

Please click to zoom in!


15.CSS Curves //CSS曲线

Please click to zoom in!


16. Footer Stickallows for the footer of a Web page to appear either at the bottom of the browser window or the bottom of the Web page content – whichever is visually lowest.

页脚帖允许一个网站页面的页脚显示在在浏览器窗口的底部或者网站页面内容的底部中实际最底的一个。

Please click to zoom in!


17. CSS Image Map //CSS图像地图

Please click to zoom in!


18. CSS Image Pop-Up //CSS图像弹出

Please click to zoom in!


19.CSS Image Preloader //CSS图像预载

Please click to zoom in!


20. CSS Image Replacement for Buttons //CSS按钮的图片替换

Please click to zoom in!


21.Link Thumbnail //链接缩略图

Please click to zoom in!


22. CSS Map Pop //CSS地图提示

Please click to zoom in!


23. PHP-based CSS Style Switcher //基于PHP的CSS样式改变

Please click to zoom in!


24. CSS Unordered List Calender (CSS Styled Calender) //CSS无序列表日历(CSS设计的日历)

Please click to zoom in!


25. CSS-Based Forms: Techniques //基于CSS的表单:技巧

Please click to zoom in!


26. CSS-Based Tables: Techniques //基于CSS的表格:技巧

Please click to zoom in!


27. Printing Web-Documents and CSS //打印网站文档和CSS

Please click to zoom in!


28. Improved Links-Display for Print-Layouts with CSS //用CSS改良打印布局的链接显示

Please click to zoom in!

0
顶一下
[1] [2]
2008-01-21 21:57:01    出处:中国设计秀cnwebshow.com
Google
网站地图 | 关于我们 | 联系我们 | 网站建设 | 广告服务 | 版权声明 | 免责声明 | 网站公告 | 友情链接 | 留言 | 旧版入口