Note: You are currently viewing documentation for Moodle 2.0. Up-to-date documentation for the latest stable version is available here: CSS FAQ.

CSS FAQ: Difference between revisions

From MoodleDocs
(Replaced content with "{{Moved_to_dev_docs}}")
 
Line 1: Line 1:
 
{{Moved_to_dev_docs}}
 
== What is CSS? ==
* CSS stands for "Cascading Style Sheets" and is a web technology for defining the layout and look of a web page. With CSS you can alter the design of your web page without modifying HTML or PHP code.
 
* [http://en.wikipedia.org/wiki/Cascading_Style_Sheets Wikipedia on CSS]
 
== Where can I learn more about using CSS? ==
 
=== Online resources ===
 
* The [http://www.w3schools.com/css/default.asp W3Schools CSS Tutorial] is a great way to learn about CSS by example.
* [http://www.alistapart.com A List Apart] is a great resource for everything regarding web design, not only CSS.
* [http://css-discuss.incutio.com CSS-Discuss Wiki] - Wiki companion to the [http://www.css-discuss.org CssDiscussList mailing list]. Includes tips and tricks and information on browser hacks, text sizing, and testing.
* [http://www.cssnewbie.com/ CSS Newbie] by Rob Glazebrook
 
* [http://realworldstyle.com Real World Style] by [http://www.alistapart.com/authors/n/marknewhouse Mark Newhouse] - CSS layouts that even work with NN4
* [http://phrogz.net/CSS/HowToDevelopWithCSS.html How to Develop with CSS]
 
* [http://www.positioniseverything.net/ Position Is Everything] attempts to describe and demonstrate some of the bugs found in web browsers, and to show advanced CSS methods that work across all browsers.
 
=== Books ===
* The books by CSS guru ''Eric Meyer'' are highly recommended:
** [http://www.ericmeyeroncss.com Eric Meyer on CSS]
** [http://more.ericmeyeroncss.com/ More Eric Meyer on CSS]
** [http://meyerweb.com/eric/books/css-tdg/ CSS: The Definitive Guide, Third Edition]
** [http://meyerweb.com/eric/books/css-pocket/ CSS Pocket Reference]
 
* [http://www.sitepoint.com/books/cssant2/ The CSS Anthology: 101 Essential Tips, Tricks & Hacks] by ''Rachel Andrew''
 
* [http://www.zeldman.com/dwws/ Designing with Web Standards, 2nd ed.] by ''Jeffrey Zeldman''
 
* [http://meiert.com/de/publications/books/978-3897217126/ Webdesign mit CSS, 2. Auflage] by ''Jens Meiert'' and ''Ingo Helmdach''. The book is in German, but you can view all designs on the web site and download the complete code. You'll also find [http://meiert.com/en/blog/20070503/on-updating-a-book-webdesign-mit-css/ English comments about the book] in the author's blog.
 
* [http://www.transcendingcss.com/ Transcending CSS - The Fine Art of Web Design] by ''Andy Clarke''
 
=== CSS references ===
* [http://reference.sitepoint.com/css SitePoint CSS Reference]
: You can have this reference at your fingertips with SitePoint's [https://addons.mozilla.org/en-US/firefox/addon/10273 CodeBurner plugin] (Firebug extension), see [[Development:Firebug#CodeBurner]].
: There's also [http://tools.sitepoint.com/codeburner/firefox/ CodeBurner for Firefox], a standalone version of the original CodeBurner for Firebug, but with an independent interface, and more dedicated search tools.
 
* [http://www.w3schools.com/CSS/CSS_reference.asp W3Schools]
* [http://www.w3.org/Style/CSS/ W3C] - In lots of languages.
 
== Where can I find examples for the use of CSS? ==
* See [http://www.csszengarden.com Zen Garden], also available [http://www.mezzoblue.com/zengarden/translations/ in different languages].
 
== Where do I find information about the CSS used by Moodle? ==
 
* [[CSS]] - overview of the use of CSS by Moodle.
*[[CSS styles_ layout.css]] contains the layout specifications for various page elements. 
*[[CSS styles_color.css]] contains the colors used in the page elements.
*[[CSS styles_fonts.css]] defines the fonts used in the page elements.
 
== Which tools are useful for working with CSS? ==
 
* [http://www.getfirebug.com Firebug Extension] for Firefox is the single most useful tool for inspecting the CSS of any web page and modifying it on the fly. See [[Firebug]] for further information.
 
* [https://addons.mozilla.org/de/firefox/addon/60 Web Developer Toolbar] for Firefox.  See also [https://docs.moodle.org/en/Category:Firefox_extensions Category:Firefox extensions].
 
* Standalone CSS editor [http://www.newsgator.com/individuals/topstyle/default.aspx TopStyle]. (You might get redirected to the new TopStyle 4 website, so here's a direct link to download the [http://www.newsgator.com/download/products/ts3lite.exe old free TopStyle 3 Lite version]).
 
* The new PHP version of [http://www.netbeans.org/features/php/index.html NetBeans] comes with integrated CSS support. You find a host of documentation, tutorials, screen casts, etc. on their web site. See also [[NetBeans]].
 
== See also: ==
 
* [[Themes FAQ]]
 
Writing high performance CSS
* [http://code.google.com/speed/page-speed/docs/rendering.html Optimize browser rendering]
* [http://www.stevesouders.com/blog/2009/03/10/performance-impact-of-css-selectors/ Performance Impact of CSS Selectors]
 
 
[[Category:Themes]]
[[Category:FAQ]]

Latest revision as of 02:05, 23 June 2011

This development related page is now located in the Dev docs.

See the CSS FAQ page in the Dev docs.