Extensive CSS List: 134 Top CSS Resources

Reference:

Official homepage of CSS – http://www.w3.org/Style/CSS/

Official documentation of CSS – http://www.w3.org/TR/CSS21/

CSS web standards – http://www.webstandards.org/learn/external/css/


Tools:

Validator from W3C (Editor’s Choice) – http://jigsaw.w3.org/css-validator/

CSS redundancy checker – http://infovore.org/archives/2007/07/06/the-css-redundancy-checker/


CSS formatting and optimizing tool (not a validation tool) – http://www.cleancss.com/

CSS Optimizer – http://www.cssoptimiser.com/

CSS Analyzer (a validator plus) – http://juicystudio.com/services/csstest.php

CSS Mate: CSS editor – http://cssmate.com/csseditor.htm

CSS Compressor (still in development, may not work correctly) – http://iceyboard.no-ip.org/projects/css_compressor

CSS Tidy – http://csstidy.sourceforge.net/index.php

Layout-o-matic – http://www.inknoise.com/experimental/layoutomatic.php

CSS rounded box generator – http://www.neuroticweb.com/recursos/css-rounded-box/

List creator – http://www.accessify.com/tools-and-wizards/developer-tools/list-o-matic/
CSS form code maker – http://www.maketemplate.com/form/

CSS layout generator – http://csscreator.com/?q=tools/layout

CSS Tweak – http://www.blazenewmedia.com/articles/css-tweak-dashboard-widget

CSS speech bubbles – http://www.willmayo.com/2007/02/10/css-speech-bubbles/


Tutorials:

Tutorial from W3C – http://www.w3.org/Style/Examples/011/firstcss

Tutorials from HTML Dog – http://www.htmldog.com/

Complete CSS guide – http://www.westciv.com/style_master/academy/css_tutorial/

W3 Schools CSS tutorials – http://www.w3schools.com/css/default.asp

HTML.net CSS tutorials – http://www.html.net/tutorials/css/

HTMLhelp.com: CSS – http://www.htmlhelp.com/reference/css/

BrainJar: using style sheets – http://www.brainjar.com/css/using/default.asp

Beginner’s guide to CSS – http://friendlybit.com/tutorial/beginners-guide-to-css-and-standards/

Creating a CSS layout from scratch – http://www.subcide.com/tutorials/csslayout/

List building tutorial from MaxDesign.com – http://css.maxdesign.com.au/listutorial/

Tutorial on floating elements from MaxDesign – http://css.maxdesign.com.au/floatutorial/

CSS no crap primer – http://wendypeck.com/css101.html

CSShark – http://www.mako4css.com/

Learn CSS positioning in 10 Steps – http://www.barelyfitz.com/screencast/html-training/css/positioning/

CSS Basics – http://www.cssbasics.com/

The complete CSS tutorial – http://www.echoecho.com/css.htm

An interactive tutorial for beginners – http://www.davesite.com/webstation/css/

CSS styles tutorial – http://www.smartwebby.com/web_site_design/css_styles_tutorial.asp

Understanding CSS (focused on Dreamweaver) – http://www.adobe.com/devnet/dreamweaver/articles/understanding_css.html

Drop shadows with CSS – http://www.phoenity.com/newtedge/drop_shadow/


Navigation Menus:

Dynamic Drive (Editor’s Choice) – http://www.dynamicdrive.com/style/

Listamatic (Editor’s Choice) – http://css.maxdesign.com.au/listamatic/

Vandelay Website Design – http://www.vandelaydesign.com/cssmenus/lists.htm

Listamatic 2 – http://css.maxdesign.com.au/listamatic2/index.htm

CSS Play – http://www.cssplay.co.uk/menus/

CSS Showcase – http://www.alvit.de/css-showcase/css-navigation-techniques-showcase.php

Exploding Boy – http://exploding-boy.com/images/cssmenus/menus.html

Vertical menus from Exploding Boy – http://exploding-boy.com/images/EBmenus/menus.html

13 Styles – http://www.13styles.com/

CSS dropdowns – http://www.positioniseverything.net/css-dropdowns.html

A list of navigation menus – http://www.alvit.de/web-dev/tabs-and-pure-css-navigation-menus.html


Links:

Web Developer’s Handbook (Editor’s Choice) – http://www.alvit.de/handbook/

CCS Accessibility and Standards Links (Editor’s Choice) – http://www.dezwozhere.com/links.html

Web Design References: CSS – http://www.d.umn.edu/itss/support/Training/Online/webdesign/css.html

40+ Tooltips Scripts from Smashing Magazine – http://www.smashingmagazine.com/2007/06/12/tooltips-scripts-ajax-javascript-css-dhtml/

The Open Sourcery – http://theopensourcery.com/oscssref.htm

Galleries:

CSS Vault (Editor’s Choice) – http://cssvault.com/

CSS Based (Editor’s Choice) – http://www.cssbased.com/

CSS Beauty (Editor’s Choice) – http://www.cssbeauty.com/gallery/

Mezzoblue & CSS Zen Garden – http://www.mezzoblue.com/zengarden/alldesigns/

CSS Tux – http://www.csstux.com/index.php

CSS Drive – http://www.cssdrive.com/

W3C Sites – http://www.w3csites.com/

CSS Remix – http://www.cssremix.com/

CSS Import – http://www.cssimport.com/

CSS Fresh – http://cssfresh.com/

Design Shack – http://www.designsnack.com/

DesignShack.co.uk – http://www.designshack.co.uk/index.php

CSS Mania – http://cssmania.com/

CSS Elite – http://www.csselite.com/

Style Crunch – http://www.stylecrunch.com/

Screen Fluent – http://screenfluent.com/

CSS Smooth Operator – http://csssmoothoperator.com/

The Horizontal Way – http://www.thehorizontalway.com/

Dark Eye – http://www.dark-i.com/

CSS Web Design Yorkshire – http://www.css-design-yorkshire.com/

Web Creme – http://www.webcreme.com/

Edu Style – http://www.edustyle.net/

Liquid Designs – http://www.cssliquid.com/category/gallery/

CSS Bloom – http://cssbloom.com/

Unmatched Style – http://www.unmatchedstyle.com/

Net Cocktail – http://netcocktail.com/

CSS Impress – http://www.cssimpress.com/

CSS Collection – http://csscollection.com/

CSS Flavor – http://www.cssflavor.com/

Screenalicious – http://www.screenalicious.com/

CSS Galleries – http://www.css-galleries.com/

Most Inspired – http://www.mostinspired.com/

Submit CSS – http://www.submitcss.com/

Inspiration King – http://www.inspirationking.com/

CSS Love – http://csslove.net/

CSS Princess – http://cssprincess.com/

Articles:

Style Gala – http://www.stylegala.com/

A List Apart’s CSS articles – http://www.alistapart.com/topics/code/css/

CSS Globe – http://www.cssglobe.com/index.asp

CSS Help Pile – http://www.artypapers.com/csshelppile/

Why use CSS-based design? – http://www.vandelaydesign.com/blog/css/why-use-css-based-design/

Expert ideas for better CSS coding from Smashing Magazine – http://www.smashingmagazine.com/2007/05/10/70-expert-ideas-for-better-css-coding/

CSS Positioning article from About.com – http://webdesign.about.com/b/a/256055.htm

CSS layout article from Glish.com – http://www.glish.com/css/

CSS Edge: advanced CSS – http://meyerweb.com/eric/css/edge/

Advanced CSS layouts article – http://www.webreference.com/authoring/style/sheets/layout/advanced/

Exploring the limits of CSS layout – http://www.sitepoint.com/article/exploring-limits-css-layout

CSS articles from Webcredible – http://www.webcredible.co.uk/user-friendly-resources/css/

CSS articles from WebsiteTips.com – http://websitetips.com/css/

Use CSS for SEO – http://www.htmlgoodies.com/beyond/css/article.php/3682856

10 CSS tricks you may not know – http://itwales.com/997814_textonly.htm

53 CSS techniques you couldn’t live without: Smashing Magazine – http://www.smashingmagazine.com/2007/01/19/53-css-techniques-you-couldnt-live-without/

CSS from the ground up – http://www.wpdfd.com/issues/70/css_from_the_ground_up/

4 reasons to use CSS-based navigation – http://www.vandelaydesign.com/blog/css/4-reasons-to-use-css-based-navigation/

Templates:

Layout Gala (Editor’s Choice) – http://blog.html.it/layoutgala/

Open Designs (Editor’s Choice) – http://www.opendesigns.org/

Osskins – http://www.osskins.com/main/

Open Source Templates – http://www.opensourcetemplates.org/

Styleshout – http://www.styleshout.com/

Zymic – http://zymic.com/show_templates.php?id=1

Open Web Design – http://www.openwebdesign.org/

CSS Design Templates – http://templates.arcsin.se/

Free-CSS-Templates.com – http://www.free-css-templates.com/

FreeCSSTemplates.org – http://www.freecsstemplates.org/

CSS Templates – http://www.free-css-templates.co.uk/free-templates/page1.php

Mollio – http://www.mollio.org/

Template World – http://www.templateworld.com/free_templates.html

Code-Sucks.com – http://www.code-sucks.com/css%20layouts/

Themes Base – http://www.themesbase.com/

CSS Template Gallery – http://tools.i-use.it/

BenMeadowCroft.com – http://www.benmeadowcroft.com/webdev/

Forums:

Digital Point: CSS forum – http://forums.digitalpoint.com/forumdisplay.php?f=39

Sitepoint: CSS forum – http://www.sitepoint.com/forums/forumdisplay.php?f=53

CSS Discuss (mailing list) – http://www.css-discuss.org/


Bugs and Hacks:

CSS crib sheet (Editor’s Choice) – http://www.mezzoblue.com/css/cribsheet/

Position is Everything – http://www.positioniseverything.net/

Browser compatibility – http://www.quirksmode.org/css/contents.html

Browser bugs – http://www.gtalbot.org/BrowserBugsSection/

Box Model Hack – http://www.tantek.com/CSS/Examples/boxmodelhack.html


Random:

Computer-generated web design – http://www.strangebanana.com/generator.aspx

CSS graph resources – http://dhtmlsite.com/cssgraphs.php


Update: These Resources have been added following the initial posting.

CSS Specifity – www.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know

Firdamatic – www.wannabegirl.org/firdamatic

Spanky Corners – http://tools.sitepoint.com/spanky/index.php

CSS Tweak – www.blazenewmedia.com/articles/css-tweak-dashboard-widget

CSS Compressor – www.cssdrive.com/index.php/main/csscompressor

CSS Grid Calculator – www.gwhite.us/downloads/css_grid_calc.html

Spiffy Corners – www.spiffycorners.com

 

Form Architect – www.formarchitect.com/index.php

Dynamic Text Replacement – www.joaomak.net/util/dtr

Generating Dynamic CSS with PHP – www.digital-web.com/articles/generating_dynamic_css_with_php

CSS Button Creator – www.thepcmanwebsite.com/css_button_creator.php

CSS, Image Sprites, Background Images and Website Optimization – www.fiftyfoureleven.com/weblog/web-development/css/css-sprites-images-optimization

 

 

 

 

 

Looking for hosting? WPEngine offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads.

19 Responses

Comments are now closed on this post.