Difference between revisions of "CSS Introduction"
|(2 intermediate revisions by the same user not shown)|
|Line 53:||Line 53:|
[[:|← Back to Builder Codex Home]]
Latest revision as of 21:28, 29 July 2013
The following is a brief introduction to CSS. If you're new to HTML & CSS, please visit our recommended links in the next section for more information.
- HTML and CSS Basics - http://training.ithemes.com/free/htmlcss
- CSS Dojo - http://training.ithemes.com/preview/webinar1
- Using Stylesheets - http://www.brainjar.com/css/using/
- CSS Video Crash Course - http://www.sitepoint.com/videos/videocss1/
- 3Schools.com - http://www.w3schools.com/css/
- Selectors - http://en.support.wordpress.com/custom-design/css-basics/
- Site Architecture v1.2 - http://codex.wordpress.org/Site_Architecture_v1.2
- Default WordPress CSS Styles -http://digwp.com/2010/05/default-wordpress-css-styles-hooks/
- WordPress Generated Classes -http://codex.wordpress.org/CSS#WordPress_Generated_Classes
Selectors are used to target which HTML element to style. Properties and values are used to set the style rules.
There are three kinds of selectors:
|Tag||An HTML tag such as h1 or p.||h1|
|Class||A class attribute of one or more elements, such as <p class="class-name">Sample text</p>. Referenced in CSS with a “.” before it.||.class-name|
|ID||An id attribute of a unique element; should only be used once, such as <div id="header">Sample header</div>. Referenced in CSS with a “#” before it.||#header|
Order of Importance
ID selectors are more important than class selectors, and class selectors are more important than HTML tag selectors. More specific selectors get applied before less specific ones. HTML elements that are the innermost ones are the most specific.
CSS& Ordering of Styles
The baseline for ordering CSS style:
- Box model
- Colors and Typography
- CSS Introduction
- Tutorial Videos
- Basic Structure
- Viewing Page Source
- Classes & IDs: Overview
- Theme CSS Outline