CSS Training - Beginner

Level: Beginner

Duration: 2 days

Cost: £375

  • Overview

  • Outline

  • Dates

  • Offers

  • Enquiry

Overview of the course
This course is designed to teach you (with a working knowledge of HTML) how to design the look and formatting of a web page or app by using Cascading Style Sheets – CSS. Our experts will help you understand how to control many different aspects of your designs by showing you the best practices and latest trends in the industry. Upon completion, you will be able to convert an HTML document into a stylised set of pages.

This course is for…
Those who already have a solid understanding of HTML language and now want to make their designs look better and more organised by deploying CSS.

Prerequisites
In order to attend this CSS training course, you should have already completed our HTML courses or have equivalent knowledge of that language.

About the application
Cascading Style Sheets (CSS) is a language used to describe the presentation and create the design of the web pages written in HTML as well as XML documents. With CSS, you can control different aspects of your sites and apps such as the font, colour, typefaces, and many more features of the style.

Introduction
  • HTML structure and content
  • Advantages of CSS
  • Creating and using style sheets
  • CSS Rules: The Basic Syntax
  • Case, whitespace and comments in CSS
  • The CSS standards
  • The scope of CSS
  • Browser support for CSS
CSS Boxes and CSS Selectors
  • The CSS box model
  • CSS and logical HTML structure
  • Styling boxes, borders, margins and padding
  • The IE box model and Quirks mode
  • Using IE6 standards mode
  • Specifying CSS distances
  • Problems with absolute units: pixels and point sizes
  • Using proportional units: em, ex and percentages
  • Formatting box edges differently
  • Shorthand syntax for sets of edges
  • Using margins and padding effectively
  • Collapsing vertical margins on paragraphs
  • Using negateve margins on boxes
  • Background images on CSS boxes
  • Grouping elements with HTML classes
  • Styling multiple elements similarly – selector grouping
  • Block boxes and inline boxes
  • Block box behaviour
  • Inline box behaviour
Text Formatting in CSS
  • Fundamentals of text formatting
  • Typefaces, alternatives and defaults
  • Text size – a serious usability issue
  • Font characteristics
  • Setting and using space within text
  • Formatting blocks of text
  • Using arbitrary inline tags
CSS Selectors and Selections
  • Using HTML element IDs in CSS
  • Using CSS descendant selectors
  • Descendant selector examples
  • Child, sibling, and pseudo-class selectors
  • Browser support and CSS Hacks
  • Working with link states
  • Link, visited, hover, active, focus
  • Modularising CSS style sheets
  • Embedded CSS styles in HTML Documents
 
CSS Positioning
  • Choosing the right CSS
  • Technique for positioning blocks
  • The position property, floats, and margins
  • Static positioning and normal flow
  • Absolute positioning outside normal flow
  • Relative positioning
  • Fixed positioning outside normal flow
More on CSS Page Layout
  • Alternative methods of CSS positioning
  • Centering blocks
  • Styling lists
  • Redefining the behaviour of inline and block elements
  • Hiding and revealing blocks
  • Table formatting in CSS
  • Styling table cell borders
  • Page layout with table display properties
Cascade, Precedence, Specificity and Inheritance in CSS
  • Cascading and cascade order
  • Resolving style conflicts by Origin
  • Resolving style conflicts by Importance
  • Resolving style conflicts by Specificity
  • Resolving style conflicts by Order
  • Non-CSS presentational hings
  • Property inheritance
CSS Layers and Translucency
  • Different forms of layered presentations in CSS
  • Layering with the z-index property
  • Different methods for creating translucency effects
  • The CSS3 opacity property
  • Opacity example
  • Fixed attachment backgrounds in layers
  • Pseudo-transparency with JPG positioned backgrounds
Using CSS in the Real World
  • Deploying CSS
  • CSS formatting vs. HTML formatting
  • Standard tags and semantic markup
  • Usability
  • Readable pages
  • Screen size and fluid design
  • Text size
  • Table layout and CSS positioning
  • CSS browser support
  • Testing websites
  • Cross-platform testing

Group Bookings

If you make a booking for three or more people to the same course, you can claim an additional 15% discount for each student from the original price of this course.

Education and Non-profit Organisations

If you are working for a non-profit organisation or an educational establishment, you can claim an additional 15% discount on all our courses.

Training Credits

Our Training Credits Scheme is the most cost-effective way to train your entire team. With this scheme, you buy training days up front and use them over one year. To see full details, visit our Training Credits Page.

Early Bird

If you book this course at least three months in advance, you can claim 15% discount from the original price.

Students and Freelancers

We know how difficult it can be to try and self-fund a course – that’s why we introduced a 15% discount to all university students and those who work as freelancers.