CSS Course - Free Lessons

This course teaches you the basics of Cascading Style Sheets, or CSS as it's commonly abbreviated.
CSS is a simple standardized syntax that gives web designers extensive control over the presentation of their web pages and is an essential component of web design today.
All you need is a simple text editor such as Notepad and a web browser, e.g. Mozilla Firefox, which is free.

CSS Lessons

  1. Writing CSS code
    - Writing CSS code, Cascading Style Sheets. Learn about CSS rules, Selectors, Properties and Values.
  2. Creating style sheets
    - Creating style sheets in the HTML document and external css file, import style sheets, adds comments.
  3. Configuring Fonts
    - Configuring Fonts, setting font type, size and font style, setting multiple values in a property.
  4. Configuring Text
    - Configuring text, setting text properties, line and word spacing, letter spacing, text decoration, align, white space, shadow.
  5. Backgrounds
    - Setting Backgrounds to HTML elements, background image, background properties: color, position.
  6. CSS Box Model
    - CSS course - Box Model, content-box properties: margin, width, height, padding, Min and Max dimensions, overflow.
  7. CSS Border
    - Draw different line styles around elements with CSS border properties, sets border-color, border-style, border-width. Shorten the stylesheet code with border shorthand.
  8. CSS Outline
    - Make the HTML element "stand out" with CSS outline properties, sets outline-color, outline-style, outline-width, outline shorthand.
  9. Display and Visibility
    - Learn how to Display a HTML element: inline, block, or to hide its Visibility in the web page.
  10. Positioning
    - Use the CSS position property to set the position of HTML elements in the web page, fixed, absolute, relative, z-index.
  11. CSS Float and Clear
    - How to use the CSS float property to push the elements horizontally to the left or right. Use "clear" to stop the wrapping effect of the float.
  12. Pseudo-classes
    - How to use pseudo-classes to add special effects to some elements of the same selector or class. Various examples with pseudo-classes applied to selectors, classes and form fields.
  13. CSS3 Pseudo-classes
    - CSS lesson, Pseudo-Classes added in CSS3: nth-child(N), nth-of-type(N), last-child, root, empty, target, enabled, checked, and other pseudo-classes.
  14. CSS Pseudo-elements
    - Pseudo-elements (after, before, first-letter, first-line) to style certain aspects or parts of an element without introducing new markup or tags in the HTML document.
  15. Define Custom List-item Markers, Bullets for UL, OL Lists
    - How to Remove, or Define Custom List-item Markers / Bullets for UL and OL Lists. Examples with: list-style, list-style-image, list-style-type, and list-style-position.
  16. Cursor property - Custom Cursors
    - How to control and create Custom Cursors with CSS, use images for cursor appearance.