css
Duration: 2 Days
This course is designed for those with some experience of HTML or XHTML who need to gain an understanding of the latest web design techniques separating presentation from mark-up through cascading style sheets (CSS).
By the end of this two day course, you will have the necessary skills to split mark up from presentation, have gained a thorough grasp of standards compliant design and have the knowledge to style web page elements with CSS. The course will also address CSS best practice guidelines and provide you with the platform to an become an accomplished CSS user.
Course Outline
- What is CSS - Overview
- Standards compliant mark up
- HTML, XHTML and XML
- Converting and moving to XHTML
- Browser issues and standards compliance
- Creating structured pages
- XHTML syntax, options and versions
- Structuring XHTML pages
- Removing presentational elements
- Working with the DOCTYPE
- Understanding natural language declarations
- Structuring content
- Headings and sub headings
- Creating paragraphs
- Working with special characters
- Creating line breaks
- Creating horizontal rules
- Numbered (ordered) lists
- Unnumbered (unordered) lists
- Creating a basic input form
- CSS in practice
- Separating content from presentation
- The difference between CSS and Mark up
- What can CSS do?
- CSS structure (syntax)
- Inserting styles (inline, embedded or external)
- The cascade order Styling text
- Specifying font size and colour
- Specifying font alignment
- Creating hover effects
- Keeping track of links
- Decorating your pages
- Background images
- Borders
- Images for bullets
- CSS page layout
- Where to use div tags
- Where to use span tags
- The CSS Box Model
- Positioning elements on the page
- Absolute vs relative positioning
- Floating elements
- Styling forms
- Properties of input elements
- Grouping form elements together
- Formatting text in forms
- Changing the appearance of buttons
- Creating a print page
- Showing and hiding elements
- Altering layout
- Changing font and font size
- Showing or hiding link information
- Creating page breaks