CSS Training

  4.8 out of 5 based on 201 Ratings

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

Introduction to CSS Training

- $690.00

If you have learned HTML and now are looking for CSS training so that you can create well-designed web pages, this is the right CSS course for you. By the end of the course, you'll have a solid understanding of how CSS works and will be able to put it to practice right away.

Next Live Class:

Advanced CSS Training

- $790.00

If you have basic CSS skills as taught in our Introduction to CSS course, but still need to improve your CSS skills to position elements on the page, format lists and forms, and target different devices, then this is the right CSS course for you. However, if you already have a lot of experience with CSS and are looking to learn the most modern CSS techniques, then our Modernizing Your CSS Skills class might be more appropriate for you.

Next Live Class:

Modernizing Your CSS Skills

- $790.00

Browser support for modern CSS has improved immensely over the last several years. If you have worked with CSS already, but want to catch up with modern techniques, then this is the right course for you. You will learn to use new CSS selectors to better target elements on the page and to create stunning effects with colors, gradients, masks and images. You'll also learn use CSS to create pages that work equally well on different devices and screen sizes.

Next Live Class:

HTML and CSS Primer

- $295.00

If you are planning to learn or already know how to use a web design tool such as Adobe Dreamweaver, it is useful to have at least basic knowledge of HTML and CSS. The intention of this course is to provide the HTML and CSS training you need to fully understand what Dreamweaver and similar web design tools are doing behind the scenes, so that you can take full advantage of their power and also so that you understand why they might not always work as expected.

Next Live Class:

Introduction to Bootstrap with Sass

If you already know HTML, CSS and at least some JavaScript, and want to learn to use Bootstrap and Sass to design, develop, and manage responsive web and mobile sites and applications, then this is the right course for you. You will first learn to use Bootstrap to quickly create modern looking web pages. Then we will teach you to use Sass to speed up better manage your CSS development. And finally, we'll show you how to use Bootstrap and Sass together.

MOC 20480 - Programming in HTML5 with JavaScript and CSS3

- $2,375.00

If you or your team needs to learn to use Visual Studio to create sophisticated client-side web applications, this is the right course for you. It covers HTML, CSS and JavaScript techniques used in modern web development, including techniques for communicating with a remote database and storing and managing data in the browser.

Next Live Class:

Rapid Introduction to HTML, CSS, and JavaScript

- $1,300.00

If you and your team need to get up to speed quickly on HTML, CSS, and JavaScript so that you can build and/or maintain the front end of websites, this may be the right course for you. But be aware that we cover a lot of material quickly. For a gentler introduction to these technologies, consider taking our Introduction to HTML, Introduction to CSS, and Introduction to JavaScript courses separately.

Next Live Class:

More CSS Courses

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

Syntax

CSS rules include selectors and declarations blocks:

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

Comments

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
  • WARNING

    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

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

External Style Sheet

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

Link to External Style Sheet

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

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."

What people say about our training

Webucator was easy to set up and I enjoyed the class.
Holly Sprunger
TechLaw, Inc.
I've never been disappointed by any Webucator course I've taken.
Kim Henderson
Oracle Corporation
Webucator's Introduction to CSS online intructor-led class surpassed my expectations.
Craig Worrell
Sheetz
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

No cancelation for low enrollment

Certified Microsoft Partner

Registered Education Provider (R.E.P.)

GSA schedule pricing

60,501

Students who have taken Instructor-led Training

11,679

Organizations who trust Webucator for their Instructor-led training needs

100%

Satisfaction guarantee and retake option

9.55

Students rated our CSS trainers 9.55 out of 10 based on 201 reviews

Contact Us or call 1-877-932-8228