Difference between revisions of "CSS Primer"
From Dreamwidth Notes
Foxfirefey (Talk | contribs) m (→CSS Basics) |
Foxfirefey (Talk | contribs) m (→References) |
||
Line 70: | Line 70: | ||
* [http://www.findmebyip.com/litmus/ CSS3 Litmus] -- which browsers support what CSS3 attributes (note: does not include FF4) | * [http://www.findmebyip.com/litmus/ CSS3 Litmus] -- which browsers support what CSS3 attributes (note: does not include FF4) | ||
+ | |||
+ | * [http://www.alistapart.com/topics/topic/css/ A List Apart -- CSS] | ||
+ | * [http://www.noupe.com/css/css-layouts-40-tutorials-tips-demos-and-best-practices.html CSS Layouts: 40+ Tutorials, Tips, Demos and Best Practices] | ||
+ | * [http://www.csszengarden.com/ CSS Zen Garden] | ||
+ | |||
[[Category: Styles]] | [[Category: Styles]] |
Revision as of 21:53, 23 April 2011
You might also want to look at the HTML Primer. This is not a complete list of CSS rules and effects.
Contents
CSS Basics
CSS Cascade -- a slideshow that explains how the browser decides which rules to apply.
Use this tutorial to get a good handle on CSS selectors: Selectutorial: CSS selectors.
Backgrounds
These properties
- background-color
- background-image
- background-repeat
- background-attachment
- background-position
- background (all in one shortcut)
Modern browsers support multiple background image declarations:
Borders
- border-width
- border-style
- border-color
- border (all in one shorthand)
Lists
References
Positioning
Absolute, Relative, Fixed
Floats
References
- CSS Positioning 101
- CSS Floats 101
- CSS Positioning
- Step by step tutorial on floats
- CSS Float Theory: Things You Should Know
- Absolute vs. Relative - Explaining CSS Positioning
- Absolute positioning inside relative positioning
- CSS Layout
Block versus inline display
- display -- You can make a span display like a block element, or a div display like an inline element, with this rule.
References
- CSS3 Litmus -- which browsers support what CSS3 attributes (note: does not include FF4)