UMSL logo

Computer Education & Training Center

CSS & CSS3 Classes

Overview of CSS & CSS3

Cascading Styles Sheets (CSS) is a standard put together by the World Wide Web Consortium (W3C). CSS3 refers to the third version of this standard, and many Web sites have incorporated new features available in CSS3.

Basically, CSS works by creating rules that select certain elements on the page and define the appearance and layout properties of those elements. The size and color of your headings, the fonts used in your paragraphs, and the organization of your page are just a few of the elements that can be controlled by CSS. When included in a separate (.css) file, they can easily be applied across multiple pages without requiring you to duplicate the same style rules over and over again.

New Features of CSS3

CSS3 Rounded Corners

CSS3 Rounded Corners Example

CSS3 Text Shadows

CSS3 Text Shadows Example

In CSS3, new features have been added that give you more ways to select elements. It also includes many new properties for visual cues that formerly required an image file. For example, some of the most-discussed new properties allow you to create:

By not requiring images to include these visual elements, you can dramatically reduce the page load time without sacrificing the appearance.

Responsive Design with CSS3

In addition, CSS3 introduces techniques for responsive design, such as media queries and text overflow options. These tools are especially important with the increasing range of devices (with different resolutions and dimensions) that access Web sites. For example, media queries allow your layouts to be more flexible by serving different style sheets based on the viewing device's resolution, making it easier for you to ensure that users on any kind of device are able to see and use your page. Users who view your page on a full-screen monitor would see both the main body and a side column, while viewers on a smartphone (with a 3.5 or 4 inch screen) may only see the main body, with the content of the side column pushed down to the bottom of the page.

CSS Legacy Issues

Like HTML5, CSS3 is supported by all modern browsers, and many Web developers use the new features. Normally, if a user has an older Web browser that does not support a particular aspect of CSS3, it will simply ignore it; therefore, you can include fallbacks when necessary and the page will still work.

CSS Classes

Our CSS classes will teach you how to efficiently and effectively use CSS to add visual quality to your Web site.

[CSS Class Schedule]