Home>All Courses > Cascading Style Sheets Training> Bespoke CSS - 2 Day Introduction

Bespoke CSS - 2 Day Introduction

Key Course Details:

Level:

Introduction to Intermediate

Location:

UK Centres, Online, Onsite

Class, Online, Onsite

Duration:

2 Days (10am-5pm)

Price:

From £949 + VAT

Dates:

Dates to suit you

Learn the basics of styling web pages as we show you how to get started with the power of CSS. Join us to see how applying simple CSS 'rules' can have dramatic effects on the look and feel of your website. Pick up the tips you need to add some polish to your web content.

This course can be based around our base outline or part/fully customised according to your level & requirements. Our bespoke Cascading Style Sheets training is offered either Online, Onsite at your offices or at one of the XChange centres in London, Manchester and Glasgow.

Overview Full Outline Location Options Related Courses Client Reviews

Bespoke CSS - 2 Day Introduction

Course Details

CSS (Cascading Style Sheets) arrived in 1996. CSS is a significant breakthrough in web design allowing designers more control over the style and layout of their web pages than can be achieved using basic HTML. You can define a style for each HTML tag and apply it to individual web pages (embedded styles), localised parts of your page (inline style) or for the entire site itself (external style sheets). With the latter, simple modifications to your style result in those changes globally updating all pages linked to your style sheet. CSS was updated in 1998 and continues to be ‘a work in progress’.

Who is this course for?

This hands-on course is designed for users who currently use HTML or have attended an HTML introduction course. The course will take users to the next level of web design allowing them to create professional looking web sites for their corporate intranet or Internet site. New users should be familiar HTML, the operating system they use and have good solid understanding of the world wide web.

Course Target Audience and delegate prerequisites:

This course is intended for web professionals interested in learning about the visual improvements that can be made through the effective use of CSS.

You will need basic PC or Mac skills, including a solid understanding of a computer's operating system (Windows or Mac OS). You will also need to know how to launch a program, create and save files, and copy files from CDs and other media. Ideally, you will have taken our HTML Essentials Introduction 1 Day course.

View Full Course Outline
Full Course Outline

The following is a general outline. The range of topics covered during your training is dependent upon student level, time available and preferences of your course booking.
CSS Introduction
- HTML Structure and Content, CSS Presentation
- 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
- Hands-on Exercises
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
- IE Box Model Workarounds
- 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 Negative 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
- Online Box Behaviour
- Hands-on Exercises
Text Formatting in CSS
- 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
- Hands-on Exercises
More CSS Selectors and Selection
- Using HTML Element IDs in CSS
- Using CSS Descendant Selectors
- Descendant Selector Examples
- Child, Sibling and Pseudo-Class Selectors
- Why You Need To Know Them
- Browser Support and CSS Hacks
- Distinguishing and Setting Link States
- Link, Visited, Hover, Active, Focus
- Modularising CSS Style-Sheets
- Simpler Management, Less Effort, More Control
- Embedded CSS Styles in HTML Documents
- How and When to Use Them (Rarely)
- Distinguishing Print, Screen and other Output Formats
- Special Issues in CSS for Print
- Hands-on Exercises
CSS Positioning
- Choosing the Right CSS
- Technique for Positioning Blocks
- The Position Property, Floats, Margins (inc. Negative and Auto), etc
- Static Positioning and Normal Flow
- Absolute Positioning Outside Normal Flow
- Relative Positioning
- Fixed Positioning Outside Normal Flow
- Relative Absolute Positioning
- Absolutely Positioned Blocks in Relatively Positioned Containers
- Floating Boxes with the CSS float property
- Page Layout Using Absolutely Positioned Blocks
- Hands-on Exercises
More on CSS Page Layout
- Alternative Methods of CSS Positioning
- Centring 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
- Hands-on Exercises
Cascade, Precedence, Specificity and Inheritance in CSS
- Taking Control: Ensuring that CSS Rules Interact in the Way You Want
- Combining Styles: Different Types, Origins, Importance, Specificity and Order
- Examples: Combining Rules
- Cascading and Cascade Order
- Resolving Style Conflicts By Origin
- Resolving Style Conflicts By Importance
- Resolving Conflict By Selector Specificity
- Resolving Conflict By Order
- Non-CSS Presentational Hints
- Property Inheritance
- Hands-on Exercises
CSS Layers and Translucency
- Different Forms of Layered Presentation 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
- Background-attachment Example
- Transparency and Semi-transpaency with Alpha-Blended PNG
- PNG Translucency Example and Sample Code
- Pseudo-Transparency with JPG Positioned Backgrounds
- JPG Pseudo Transparency Example
- Hands-on Exercises
Using CSS in the Real World
- Deploying CSS
- CSS Formatting Versus HTML Formatting
- Achieving a Balance
- Standard Tags and Semantic Markup
- Usability
- Readable Pages
- Screen Size and Fluid Design
- Text Size, Including Internet Explorer Quirks
- Table Layout and CSS Positioning
- Table Layout and CSS Positioning as Alternatives
- Combining Table Layout with CSS Positioning
- CSS Browser Support
- Testing Websites
- Using Test Suites and Multiple Browsers
- Cross-platform Testing in Single-platform Environments
- CSS Help and Advice
- Authoritative Sources versus Web Myths and Gossip
- Free Lifetime Support
Training Location Options
Online ↓ London ↓ Manchester ↓ Glasgow ↓ Onsite ↓
This course is offered for your convenience at one of our bespoke training centres in London, Manchester and Glasgow, Remote Online, or Onsite at your offices anywhere in the UK. Just let us know what would work best for you or your team.

Remote Online

Delivered Online to your location

Live online training offers an extremely flexible and convenient way of covering the same content as our bespoke classroom based courses. You will receive professional, certified design training from one of our experienced instructors direct to your screen, offering the perfect solution for those wishing to learn without having to travel.
Click to view Full details of our
Remote Online Training Courses

Central London

5 St John’s Lane, Clerkenwell, EC1M 4BH

St John’s Lane is located in the heart of Clerkenwell close to the junction of Farringdon and Clerkenwell Road. Farringdon tube & train station is just a few minutes away and the training centre can also be accessed from Chancery Lane and Barbican tubes in about 10 minutes. There is also easy direct access by bus from Waterloo (243) and West End (55) with nearby stops.
Click to view Full details of our
London Training Centre

Central Manchester

Piccadilly House, 49 Piccadilly, M1 2AP

Piccadilly House is located in central Manchester directly next to the Piccadilly Gardens transport interchange with excellent bus and tram connections and is easily accessed from Piccadilly train Station (5 mins). Victoria station is also close by (around 10 mins).
Click to view Full details of our
Manchester Training Centre

Central Glasgow

Centrum Business Centre, 38 Queen Street, G1 3DX

The Queen Street training centre is located in central Glasgow within easy walking distance of the 3 local train options of Central Station, Queen Street and Argyle Street offering excellent transport connections.
Click to view Full details of our
Glasgow Training Centre

Onsite

Onsite at your Offices/Premises

If you have the required set up and would prefer to have the training at your location we will be able to deliver the same session onsite at your premises as in our training centres. This will provide you with the same tailored training but without the need to travel and less disruption to you or your teams work schedule.
Click to view Full details of
Onsite Training
Related Courses

Below are related bespoke courses for alternative tailored training options.

Bespoke Cascading Style Sheets Training Courses
Cascading Style Sheets - 1 Day Introduction Training Course CSS and HTML - 2 Day Introduction Training Course
Bespoke Cascading Style Sheets Training Courses
Cascading Style Sheets - 1 Day Introduction Training Course
Bespoke Adobe Dreamweaver CC Training Courses
Adobe Dreamweaver CC - 2 Day Introduction training Adobe Dreamweaver CC - 1 Day Intermediate training
Bespoke Adobe Flash CC Training Courses
Adobe Flash CC - 2 Day Introduction training
Bespoke HTML Training Courses
HTML - 1 Day Introduction Training Course HTML and CSS - 2 Day Introduction Training Course
Client Reviews

''Course went at a good pace. The trainer was very enthusiastic about the content and able to explain the concepts well and at the right pace.''
Peter Leatherland, NGI, HTML & CSS - 2 Day Introduction
''The training was very well structured and the trainer out did himself. Very impressed with the detail the course went into and I am confident that I have learnt all that I needed to. I will most certainly be back. ''
Garritt Glasby, Australian high Commission, HTML5 & CSS3 - 3 Day Introduction
''The content of the course was taught and explained in a way that was easy to follow and always explained until all understood.''
Scott McCirie-Hallman, Westminster Uni, HTML5 & CSS3 - 2 Day Introduction
''Excellent content and overall experience, very useful. Exactly what I expected and more. Cheers!''
Adam Hypki, Trinity Laban, HTML & CSS - 2 Day Introduction
''Fantastic course and enthusiastic instructor. Thanks.''
Kelly Western, Video Combo - 5 Day Masterclass
''The instructor was fantastic - very easy going and very knowledgeable. I really enjoyed the course and will definitely look to have more training in future through XChange Training.''
David Merritt, DSM Services, SketchUp - 1 Day Introduction
''Brilliant two days of training which allowed me to be confident in my own self taught/on the job knowledge, efficient working methods and hints and tips. Thank you. ''
Jackie Williams, British Council, Adobe InDesign - Two Day Advanced
''Very good. Covered all the areas I wish to use and more. Look forward to the intermediate course''
Roshni Narsi, ITFC, Microsoft Word - 1 Day Introduction
''For such a brief time frame an awful lot is covered. The walk-throughs via projection were excellent and instruction/explanation was excellent. He is clearly a very knowledgeable professional!''
Angelo Christodoulou, Queen Mary University, InDesign - 1 Day Introduction
''Really informative and useful training, I learnt so much about DaVinci Resolve within just 2 days. This training course has now really given me the confidence to use this software more efficiently.''
Emma Pink, Guys & St Thomas NHS Trust, DaVinci Resolve Editing - 2 Day Introduction

Frequently Asked Questions:

What dates are available for this course?

As a bespoke course the date arrangement is based around your requirements and availability in our schedule. With your guide of when you are looking for the training we will advise suitable date options ahead of finalising the planned date(s).

Can the content be tailored to my requirements?

Yes we are flexible about tailoring content and can adapt to be fully based on your requirements, a mixture of content from different levels of our base courses or a base outline with some additional focus areas.

Can this course be delivered live online?

Yes we can provide the same bespoke course as a live online session connecting to you or your group with either Zoom or Microsoft Teams if preferred.

What is the cost to deliver the course onsite?

We are equally able to deliver our bespoke training onsite at your premises and the cost to deliver this is the same structure as classroom with the addition of basic expenses depending on your location. Onsite courses in and around London, Manchester and Glasgow are usually without additional costs.

Can the course include my work samples?

It is often possible to review and include consideration towards sample files however the main course content is usually structured around prepared examples which are best suited to the planned content and structure of teaching the required skills in the best format.