问题描述
任何人都可以为CSS"设计模式"推荐一个好的在线资源?
我知道软件上下文中的设计模式通常是指基于OO的设计模式,但我是指更广泛的术语意义上的设计模式:即常见问题/任务的常见,干净的解决方案.
这样的资源的一个示例是表设计列表,这为您提供了真正需要了解如何使用一组CSS技术使桌子看起来不错的所有信息.
其他可能具有不错的解决方案的常见问题示例将是诸如DIV上的圆角,高度可用的表单布局等.
推荐答案
我参考 extall 始终为这些类型的文章 事物.
他们进行了大量的反复研究,以提出真正创造性的方法,以最清洁的最便携式方式处理这些常见的CSS问题.
其他推荐答案
一些解决Web设计模式的网站在下面列出.他们没有专门提供HTML和/或CSS来实现所需的结果,但是它们确实提供了您可以在上可以查看source 的实时示例(或者更好,甚至更好,使用 firebug ).
ui-patterns
这可能是最好的.它将内容分为涵盖网页设计任务广度的类别.您会发现诸如标签云,实时预览和用户注册之类的类别.这是一个非常全面的资源,井井有条.它解释了每种模式并提供了很多示例.
图案tap
类似于UI-Patterns,尽管目前不那么全面.通过允许用户创建自己的类别("用户集")并使用自己的网站选择,它需要一种更社交的方法来整理设计模式.
yahoo设计模式图书馆
与其他两个不同,这没有提供许多真实站点的示例.它组织良好,非常全面.
设计元素
这是一个博客,展示了网页设计的各种元素.它没有讨论模式,而是作为灵感的快速来源或作为开始自己的分析的一种手段.
的一种手段.其他推荐答案
floatutorial 是学习重要的CSS属性的一个很好的起点" float"以及如何使用一些常见图案(包括两列和三列液体布局)使用它来布局内容.
floatutorial带您完成 浮动元素的基础知识,例如 图像,下帽,下一和背部 按钮,图像画廊,内联列表 和多列布局.
问题描述
Can anyone out there recommend a good online resource for CSS 'design patterns'?
I know design patterns in a software context usually refer to OO based design patterns, but I mean design patterns in the broader sense of the term: i.e. common, clean solutions to common problems / tasks.
An example of such a resource would be this list of table designs, this gives you all you really need to know about how to make tables look nice using a set of CSS techniques.
Other examples of common problems which could have nice set solutions would be things like rounded corners on divs, highly usable form layouts etc.
推荐答案
I refer to A List Apart articles all the time for those sorts of things.
They do a lot of trial-and-error research to come up with really creative ways to handle those common CSS problems in the cleanest most portable way possible.
其他推荐答案
Some websites that address web design patterns are listed below. They do not specifically provide the HTML and/or CSS in order to achieve the desired results, but they do provide examples of live sites that you can view source on (or, even better, use Firebug).
UI-patterns
This is probably the best of the bunch. It breaks things down into categories that cover the breadth of web page design tasks. You'll find categories such as tag-clouds, live preview and user registration among many others. This is a really comprehensive resource that is well organized. It explains each pattern and provides plenty of examples.
Pattern Tap
Similar to UI-Patterns although currently not as comprehensive. It takes a more social approach to collating design patterns by allowing users to create their own categories ("user sets") and populate them with their own selection of sites.
Yahoo Design Pattern Library
Unlike the other two, this one doesn't provide many examples of real sites. It is well organized and quite comprehensive.
Elements of Design
This is a blog showcasing various elements of web design. It doesn't discuss the patterns, but is good as a quick source of inspiration, or as a means to start your own analysis.
其他推荐答案
The Floatutorial is a great starting point for learning the important CSS attribute "float" and how to use it to layout content using some common patterns including two-column and three-column liquid layouts.
Floatutorial takes you through the basics of floating elements such as images, drop caps, next and back buttons, image galleries, inline lists and multi-column layouts.