30+ CSS Cheat Sheets & Quick Reference Guides(转)
| 热度: |
![]() |
30+ CSS Cheat Sheets & Quick Reference Guides
I would be hard pressed to find a web designer or web developer who doesn’t like a helpful CSS Quick Reference Card or Cheat Sheet. Cheat Sheets can help you save so much time and can really help you learn about CSS in an easy to understand format. I have gathered a list of CSS cheat sheets that I have found to be the most helpful.
Antharia: CSS Cheat Sheet (PDF)
A CSS Reference Guide and Cheat Sheet in PDF Format.
Apple’s CSS Cheat Sheet Widget (Mac Dashboard Widget)
About.com: Basic CSS Cheat Sheet
This cheat sheet covers the basics of CSS: What CSS is, How to add style sheets, Basic CSS syntax, and Font, text, color, backgrounds, and some box properties.
About.com : CSS Layout Cheat Sheet
One of the most challenging parts of advanced CSS is learning to use it for layout. The best way to learn CSS layout is to do it, but this cheat sheet will help you with remembering Element types, CSS box model, Positioning elements, and Using float for layout.
Added Bytes: CSS Cheat Sheet (V1)
The CSS cheat sheet is designed to act as a reminder and reference sheet, listing all selectors (as of CSS 2.1) and properties. It includes a visual example of the box model, unit reference for CSS units and the various media types CSS makes allowance for. A description of what is on the cheat sheet follows, or if you are impatient, you can go straight to the full size CSS cheat sheet.
Added Bytes: CSS Cheat Sheet (V2)
The CSS cheat sheet is a one-page reference sheet, listing all selectors (as of CSS 2.1) and properties. It includes a visual example of the box model, unit reference for CSS units and the various media types CSS makes allowance for.
Download the latest version from http://code.google.com/p/blueprintcss/ and add this lines into the of your page. Check that your href path is correct.
CommunityMX: CSS Cheat Sheet: Inheritance, Cascade, Specificity
Even seasoned CSS developers need a quick refresher course in CSS concepts and techniques from time to time. This CSS Cheat Sheet is designed for just that need. Use it as a reference for topics that you’ve already learned about in-depth but need a few reminders on. If you’re still a beginner to CSS, use it to learn the nuts and bolts of working with CSS, then use our other articles, listed at the end of this one, to extend your learning and practice your new skills. This Cheat Sheet reviews how the fundamental CSS concepts of inheritance, cascading and specificity work.
Cogeco : CSS Quick Reference Guide
This page is guide of the most commonly used CSS measurements, properties and values, selectors and media types. For the definitive specification of CSS refer to the W3 consortium website. CSS 2.1 is the current recommendation.
CSS Shorthand Cheat Sheet (PDF)
A very well illustrated CSS shorthand cheat sheet and guide.
Design 215 : CSS Quick Reference Guide (PDF)
A quick reference chart, listing only the CSS features that work in most browsers. CSS Functions only supported by Internet Explorer are not listed.
Digilife : Cascading Style Sheets Level 1 properties Cheat Sheet : (PDF)
A quick reference guide for CSS users including text properties
Dev Guru : CSS Quick Reference Guide
A quick reference guide for CSS2 from Dev Guru.
Dustin Diaz: CSS Shorthand Guide
There is no official guide for each and every CSS shorthand property value. So let’s work together and put one together shall we? Ok. Straight to the business. Anytime I’ve ran into a specification (besides the confusing mess at the W3C), it turns into showing off a couple of examples and you’re supposed to be set on your way. Well well. Over the years, I’ve found quite some interesting unknown quirky facts about these shorthands… hence this Guide was born.
Reference cards are concise guides you can keep handy when mastering a new skill. They are cheatsheets on steroids. DZone produces an attractive weekly series of RefCardz, including this great two-part series on CSS web design. The RefCardz series is geared towards developers — however these two free guides are a great resource for web designers deepening their CSS skills.
eGenius: Cascading Style Cheatsheet
A cheat sheet and quick reference guide to basic CSS concepts, units, cascading, fonts, color properties, background properties, text properties, boxes, box properties, classification properties, positioning properties, pseudo-classes and pseudo-elements, printing properties, etc.
Elizabeth Castro : CSS Properties and Values
This is a very hand help sheet to have to remember all of the CSS properties and values.
Free Net Builders – CSS Cheatsheet
A Cheat Sheet for css refrence
GoSquared : Liquidicity CSS Help Sheet (PDF)
A great CSS sheet sheet and quick reference guide that is put together in a very easy to follow format.

The CSS Cheat Sheet is a listing of commonly used selectors and properties.
Ian Graham : CSS Level 1 and CSS-P Quick Reference Charts (PDF)
Ian Graham’s site has this cool cheat sheet to use as a quick reference guide to CSS.
Idea3 offers a nifty CSS cheatsheet and quick reference guide for font properties, backgrounds, borders, text formatting, layout formatting, link attributes, colors, units, position property, overflow, clipping, z-index, etc.
IFSkinZone: CSS Cheat Sheet (HTML)
Find out the Default CSS w/ Descriptions.
Javascript Kit: CSS Reference Guide
CSS Reference (based on MSDN and WC3 CSS reference)
Kaushik’s Tech Blog : CSS Cheat Sheet
Here’s a handy cheat-sheet for most of your CSS needs.
KillerSites : HTML and CSS Codes
This page contains a list of up-to-date HTML& CSS tags / codes, complete with comments and mini video tutorials – just click on the corresponding links to launch the video.
Leigeber : CSS Shorthand Cheat Sheet by Example (PDF)
Try and use these principles whenever you code and before too long shorthand will become second nature.
Leslie Franke: CSS Cheat Sheet
A great cheat sheet and quick reference guide to CSS for syntax, fonts, text, borders, box models, backgrounds, and lists.
Liberty Boy : Cascading Style Sheets Quick Reference Guide
Cascading Style Sheets Quick Reference.
NHS Designs: CSS and Web Design Cheat Sheet
A resources cheat sheet for web design and CSS codes.
Peter Frietag :CSS Cheat Sheet and Quick Reference Guide
Not as pretty as some of the other cheat sheets, but it is worthwhile to take a look at.
Quick Reference to Cascading Style Sheets, level 1 – A Quick Reference to CSS, Level 1.
Size Factory - The CSS cheat sheet provides an at-a-glance perspective of common CSS practices; it’s one of the few times when cheating won’t ruin your karma.
Tag Index : CSS and HTML Cheats and Codes
HTML and CSS Quick Reference .. HTML Tags, CSS Properties, Codes and Examples.
TampaBay: Cascading Style Cheatsheet
This document styled to print well in portrait orientation, medium text size, with one inch or less margins. Promiscuously compiled and edited, this document is a convenient guide to the most common styles, meant to be neither authoritative nor complete. I thank the public response which has given this page #1 ranking at Google and equal ranking at Yahoo.
TamHSC : CSS Cheat Sheet (PDF)
A shorthand guide to CSS for those who want a quick reference.
This is a cheat sheet for creating Cascading Style Sheets (CSS) files.
Tech-Evangelist: Using CSS Shortcuts
CSS shortcuts combine cascading style sheets rules into one efficient line of code. If your web site uses large stylesheets, cutting down on the amount of CSS code can help your code to load and render faster.
Veign : CSS Quick Reference Guide
Quick reference guide for CSS 2.
CSS reference guide for Background, Border, Classification, Dimension, Font, Generated Content, List and Marker, Margin, Outlines, Padding, Positioning, Table, Text, Pseudo-classes, and Pseudo-elements
YUI Library: CSS Reset, Base, Fonts, and Grids (PDF)
YUI works in both “Quirks” and “Standards/Strict” browserrendering modes, but we suggest using Standards mode by specifying this Doctype:
Othere Web Blogs with List of CSS Cheat Sheets
27 Adobe Photoshop Cheat Sheets and Quick Reference Cards for Adobe Photoshop CS4, CS3, CS2 – I would be hard pressed to find a web designer or graphic designer who doesn’t like a helpful Photoshop Quick Reference Card or Cheat Sheet. Cheat Sheets can help you save so much time and can really help you learn about Adobe Photoshop in an easy to understand format. I have gathered a list of Adobe Photoshop cheat sheets that I have found to be the most helpful.
40+ Useful Cheat Sheets for Designers – In this collection, you’ll find 40+ of the best cheat for graphic designers for either the Mac or the Windows operating systems. You’ll find cheat sheets for popular graphic design applications such as Photoshop, Illustrator, and Fireworks. These cheat sheets available in various formats including PDF, PNG, and web-based (HTML) formats.
70+ Cheat Sheets for Web Developers - Cheat sheats, or reference sheets, are a helpful and quick way to remember things. Web designers, by nature of their work, are forced to cram their heads with TONS of information ranging in many different areas. In this particular post, we have created a dynamite list of 70+ helpful cheat sheets we found on the web to help web designer’s manage all this information. If you are a web designer/web developer looking for reference sheets on HTML, XHTML, CSS, PHP, JAVASCRIPT, PHOTOSHOP, COLORS & HTACCESS, this list is for you! Also comment on your favorite cheat sheets and any other which we have missed. Enjoy.
15 Useful Cheat Sheets for Web Developers – You will find most of these pretty useful.
The Cheat Sheet Cheat Sheet: Top 100 Lists of Web Development Cheat Sheets - With the vast array of web development knowledge available on the Internet, there’s certainly no shortage of cheat sheets to be found. However, finding a way to wrangle them all into one place isn’t quite as easy. That’s why we’ve compiled a list of some of the best cheat sheet collections out there. That’s right: this is your newest cheat sheet for cheat sheeting.
CSS Model : CSS Cheat Sheets - It is really great to see many of the CSS designers share their cheat sheets with everyone on the net. You can quickly learn about CSS properties from a list of good websites below no matter whatever your CSS skill level is.
Cheat Sheets for Front-end Web Developers - Cheat sheets are helpful to have around because they allow you to quickly remember code syntax and see related concepts visually. Additionally, they’re nice decorative pieces for your office. In this article, you’ll find 23 excellent, print-ready cheat sheets for HTML/HTML, CSS, and JavaScript (including MooTools and jQuery).
Cheat Sheets For HTML,CSS, jQuery, PHP, Expression Engine – Cheat sheets save time and help you quickly see what other ways of coding are possible. Enjoy these Cheat Sheets For HTML,CSS, jQuery, PHP, Expression Engine!
Cheat Sheets : BlogZero - But this isn’t the only solution for quick reference material. There are plenty of online synopsis pages which you can bookmark, or even Firefox extensions for this sort of thing. DevBoi is one (an unfortunate name, I must say) that runs in your browser’s sidebar and offers reference material on HTML and XHTML, CSS, JavaScript and DOM, and has addon packages for PHP, XUL, RoR, and Prototype. What, no jQuery Martin?
CSS Cheat Sheet - The single-page sheet packs in a wealth of CSS info, categorically covering everything from borders and backgrounds to lists and fonts. There’s even a diagram of a box model—very handy. While you’re at it, check out Franke’s Firefox cheat sheet, which lists just about every Firefox shortcut known to man. Good stuff! — Rick Broida
HTML, CSS, PHP, and More Cheat Sheets - Building a blogIf you are into tweaking your WordPress Theme or designing one from scratch, here are some HTML/XHTML and CSS Cheat Sheets you might want to add to your resources.
Must Have Useful Cheatsheets - Cheatsheets that any web developer would cherish.
The Best Cheat Sheets for Web Developers – Cheat sheet is a reference tool that provides simple, brief instructions for accomplishing a specific task. We have collated a set of best cheat sheets for web developers. It includes some of the popular programming language, e.g. jQuery, Mootools, Prototype, PHP, MySQL and etc… Please feel free to suggest some of the cheat sheets we did not mention.
Web Developer Lists : Printable Cheat Sheets – CSS Cheat Sheets (8 links) : Printable CSS cheat sheets including : # CSS level 1 – Quick Reference Card – PDF # CSS level 2 – Quick Reference Card – PDF # CSS Cheat Sheet – PDF # CSS Cheat Sheet – PNG # CSS Property Index : all properties in alphabetical order # Cascading Style Cheatsheet : Most useful CSS properties with examples # CSS Shorthand Guide : CSS properties with examples












































