CSS Training: Onsite and Online

Whether you're looking for customized in-person CSS training for a private group or a public online CSS class you can join, Webucator has the solution for you.

Filter and Sort

CSS Versions

6-min Narrated Presentation on CSS

  • History of CSS
  • Purpose of CSS
  • CSS: Difficulty Level
  • CSS: The Good
  • CSS: The Future
  • CSS Syntax

History of CSS

  • 1994 – CSS Proposed
  • 1996 – CSS 1 Recommendation Released
  • 1998 – CSS Level 2 Recommendation Published
  • 1999 – CSS Received Much Needed Browser Support
  • 1999 – First Drafts of CSS3

Purpose of CSS

  • CSS separates the structure (the markup language) of a document from the presentation
  • CSS controls the layout, color, and fonts of documents
  • CSS allows consistency of design and precise control

CSS Difficulty Level

CSS: The Good

  • Easy to learn
  • Easy to make changes to the layout and design of a web site without changing the HTML

CSS: The Bad

  • Display isn't always consistent across browsers
  • CSS lacks basic scripting capabilities

CSS: The Future

  • Properties constantly added
  • External programs relied on will become part of the CSS Specification
  • New libraries


CSS rules include selectors and declarations blocks:

selector {
	property: value;
	property: value;
	property: value;


Comments in CSS begin with "/*" and end with "*/"

p {
	color: red; /*Paragraphs should be red*/

CSS Selector: Type

Specifies elements by tag name and affect every instance of that element type:

p {
	color: darkgreen;
	font-family: Verdana;
	font-size: 10pt;

CSS Selector: Descendant

Specifies elements by ancestry. Each "generation" is separated by a space

p strong {
	color: red;

CSS Selector: Child

    Indicates a parent-child relationship
  • Is indicated > between the two tag names
    p > strong {
    	color: red;

CSS Selector: Class

  • The HTML class attribute assigns a class name to an element
  • Names should be descriptive of the purpose of the class

    Don't go there!

    A CSS class selector begins with a dot (.) .warning { font-weight: bold; color: #ff0000;

CSS Selector: ID

  • Uniquely identifies an element on the page
  • Begins with a pound sign (#)
  • Has arbitrary names
    #mainText {
    	margin-left: 20px;  margin-right: 20px;
    This is the main text of the page...

CSS Selector: Attribute

Specifies elements that contain a specific attribute and its value

a[target] {
	color: red;

CSS Selector: Universal

  • Matches every element
  • Applies to the rule to all elements used
  • Indicated by an asterisk (*)
    * {
    	  color: red;

CSS "Cascading" Precedence

  • The rule with the more specific selector takes precedence
  • If two selectors have the same specificity, the rule specified later in the document takes precedence

Embedded Style Sheets

<meta charset="UTF-8">
<title>Embedded Style Sheet</title>
	.warning { color: #ff0000;}
	h1.warning {text-decoration: underline;}
	p.warning {font-weight: bold;}
<h1 class>="warning">WARNING</h1>
<p class>="warning">Don't go there!</p>

External Style Sheet

.warning {
	color: #ff0000;
h1.warning {
	text-decoration: underline;
p.warning {
	font-weight: bold;

Link to External Style Sheet

<meta charset="UTF-8">
<title>External Style Sheet</title>
<link href="StyleSheet.css" rel="stylesheet">
<p>class="warning">Don't go there!</p>

Inline Style

Common Greetings

  • Hello
  • Hi
  • Howdy

Keep Learning CSS

By taking a Webucator CSS Class: https://www.webucator.com/webdev-training/css-training.cfm

"The course delivered a nice introduction to CSS, allowing me to be able to read and understand existing CSS code, as well as feel confident in modifying the code, and with some practice, writing it from scratch myself."

No cancelation for low enrollment

Certified Microsoft Partner

Registered Education Provider (R.E.P.)

GSA schedule pricing


Students who have taken Live Online Training


Organizations who trust Webucator for their training needs


Satisfaction guarantee and retake option


Students rated our CSS trainers 9.61 out of 10 based on 62 reviews

My learning experience was flexibly tailored to fit my particular needs of managing websites and understanding the languages of website development. The course material is content rich and I was given extra material for future reference ...Thanks!

Rob Rogers, devi mandir
Napa CA

Instructor was very knowledgeable and helpful. I really like the online format and feel that it was just as effective (perhaps more so) than actual in-classroom training.

Amy Gilbert, University of Texas HSC
Houston TX

The flexibility that Webucator provides is excellent and unique.

Nollie Gildow-Owens, Dept of Interior/BOEM
Tucson AZ

Instructor did a great job teaching Advanced CSS. Thanks Webucator!

Craig Cecil, Intergraph Corporation
Madison AL

Contact Us or call 1-877-932-8228

Where We Have Trained
We've provided Web Development training all over North America!

  • Calgary, AB
  • Anchorage, AK
  • Juneau, AK
  • Dothan, AL
  • Huntsville, AL
  • Little Rock, AR
  • Chandler, AZ
  • Luke AFB, AZ
  • Phoenix, AZ
  • Scottsdale, AZ
  • Tempe, AZ
  • Tucson, AZ
  • Vancouver, BC
  • Brentwood, CA
  • Cypress, CA
  • Cyprus, CA
  • Davis, CA
  • El Dorado Hills, CA
  • El Segundo, CA
  • Folson, CA
  • Los Angeles, CA
  • Milpitas, CA
  • Mountain View, CA
  • Norwalk,, CA
  • Palo Alto, CA
  • Pleasanton, CA
  • Redwood City, CA
  • Roseville, CA
  • Sacramento, CA
  • San Diego, CA
  • San Francisco, CA
  • San Jose, CA
  • San Ramon, CA
  • Santa Clara, CA
  • Santa Cruz, CA
  • Santa Monica, CA
  • Sunnyvale, CA
  • Torrance, CA
  • West Hollywood, CA
  • Woodland Hills, CA
  • Centennial, CO
  • Colorado Springs, CO
  • Durango, CO
  • Evergreen, CO
  • Golden, CO
  • Louisville, CO
  • Peterson AFB, CO
  • Schriever AFB, CO
  • Bristol, CT
  • Fairfield, CT
  • Hartford, CT
  • New Britain, CT
  • Norwalk, CT
  • Trumbull, CT
  • Washington, DC
  • Bushnell, FL
  • Fort Lauderdale, FL
  • Melbourne, FL
  • Miami, FL
  • Orlando, FL
  • Palm Bay, FL
  • Sarasota, FL
  • Satellite Beach, FL
  • Sunrise, FL
  • Tallahassee, FL
  • Tampa, FL
  • Alpharetta, GA
  • Atlanta, GA
  • Ft Benning, GA
  • Marietta, GA
  • Norcross, GA
  • Honolulu, HI
  • Cedar Rapids, IA
  • Dubuque, IA
  • Boise, ID
  • Aurora, IL
  • Barrington, IL
  • Chicago, IL
  • Harrisburg, IL
  • McHenry, IL
  • Mount Prospect, IL
  • Romeoville, IL
  • Skokie, IL
  • Westchester, IL, IL
  • Fort Wayne, IN
  • Indianapolis, IN
  • Leawood, KS
  • Wichita, KS
  • New Orleans, LA
  • Shreveport, LA
  • Bedford, MA
  • Boston, MA
  • Boxboro, MA
  • Cambridge, MA
  • Chelmsford, MA
  • Chicopee, MA
  • Concord, MA
  • Foxborough, MA
  • Framingham, MA
  • Holyoke, MA
  • Ipswich, MA
  • Leominster, MA
  • Northampton, MA
  • Peabody, MA
  • Randolph, MA
  • Waltham, MA
  • Watertown, MA
  • Worcester, MA
  • Annapolis Junction, MD
  • Baltimore, MD
  • Columbia, MD
  • Hanover, MD
  • Linthicum Heights, MD
  • Owings Mills, MD
  • Rockville, MD
  • Towson, MD
  • Augusta, ME
  • Ann Arbor, MI
  • Canton, MI
  • Detroit, MI
  • Grand Rapids, MI
  • Macomb, MI
  • Minneapolis, MN
  • Stillwater, MN
  • White Bear Lake, MN
  • Creve Couer, MO
  • Jefferson City, MO
  • Saint Louis, MO
  • St. Joseph, MO
  • St. Louis, MO
  • Jackson, MS
  • Vicksburg, MS
  • Fredericton, NB
  • Moncton, NB
  • Cary, NC
  • Elizabeth City, NC
  • Morrisville, NC
  • Raleigh, NC
  • Shelby, NC
  • Winston-Salem, NC
  • Bismarck, ND
  • Minot, ND
  • Bellevue, NE
  • Lincoln, NE
  • Offutt AFB, NE
  • Omaha, NE
  • Papillion, NE
  • Bridgewater, NJ
  • Elizabeth, NJ
  • Fort Monmouth, NJ
  • Franklin Lakes, NJ
  • Lawrenceville , NJ
  • Marlton, NJ
  • Nutley, NJ
  • Park Ridge, NJ
  • Pennington, NJ
  • Pennsauken, NJ
  • Roseland, NJ
  • Titusville, NJ
  • Trenton, NJ
  • Albuquerque, NM
  • Gardnerville, NV
  • Henderson, NV
  • Reno, NV
  • Albany, NY
  • Amherst, NY
  • Bayside, NY
  • Bronxville, NY
  • Brooklyn, NY
  • Buffalo, NY
  • Clinton, NY
  • Garden City, NY
  • Goshen, NY
  • Grand Island, NY
  • Jamesville, NY
  • Long Island City, NY
  • Melville, NY, NY
  • New York, NY
  • NYC, NY
  • Orangeburg, NY
  • Port Washington, NY
  • Poughkeepsie, NY
  • Pulaski, NY
  • Queensbury, NY
  • Rochester, NY
  • Syracuse, NY
  • Troy, NY
  • White Plains, NY
  • Akron, OH
  • Cincinnati, OH
  • Columbus, OH
  • Dayton, OH
  • Liberty Township, OH
  • Lima, OH
  • Orrville, OH
  • Toledo, OH
  • Norman, OK
  • Oklahoma City, OK
  • Brampton, ON
  • London, ON