Advanced CSS Training

Details

In this advanced CSS training class, students will learn to use CSS to format forms, create list-based navigation, do advanced page layouts, and create stunning background effects. Students will also learn about CSS coding conventions and shorthand properties.

This course has been updated to use the latest CSS3 methods. Experienced CSS users may want to consider taking our CSS3 for Web Developers course.

Enrollment Options:

Instructor-Led
6 Weeks Access Course Code: T5246
Start Dates* Jul 17 | Aug 14 | Sep 18 | Oct 16
*Choose start date in cart

$99.90

USD

Enroll before 31th May and get high quality lamination on your hardcopy certificate absolutely free! Use your certificate to your advantage by showing your certified credentials to prospective employers and recruiters.

Syllabus

  1. Positioning and Visibility
    1. Element Flow
    2. Position
      1. Absolute Positioning
      2. Relative Positioning
      3. Fixed Positioning
    3. Exercise: Positioning
    4. Z-index
    5. Display
    6. Visibility
    7. Float
    8. Clear
  2. Advanced CSS Page Layout
    1. Resetting Styles
    2. Full Width Layouts
      1. Two-column
      2. Three-column
    3. Exercise: Positioning the Headings
    4. Fixed Width Layouts
    5. A Recommendation on Positioning
    6. Exercise: Laying Out a Page - The Power of Float
      1. Other Methods of Layout
    7. CSS Text Columns
    8. Flexible Box Model
    9. Exercise: Flexible Box Layout
  3. Media Queries
    1. Media Queries
      1. What Are Media Queries?
      2. The Viewport Meta Tag
      3. A First Example
      4. Responsive Design
    2. Exercise: Responsive Design for a Simple Blog
    3. Image Widths
    4. Exercise: Responsive Design for a Simple Blog (Three Views)
  4. CSS Shorthand Properties
    1. What is CSS Shorthand?
      1. Benefits of Using CSS Shorthand
      2. Value Order of CSS Shorthand Properties
      3. CSS Initial Values
    2. Shorthand Margin and Padding
    3. Shorthand Border
    4. Shorthand Backgrounds
    5. Shorthand Fonts
    6. Shorthand Lists
    7. Exercise: Using Shorthand
  5. CSS Lists as Hierarchical Navigation
    1. Menus as Lists
    2. CSS Horizontal Menu
    3. CSS Vertical Menu
    4. CSS Dynamic Menus
      1. CSS Dropdown Menu
      2. CSS Flyout Menu
    5. Exercise: Combining Dropdown and Flyout Menus
    6. CSS
    7. Menus
      1. Dropdown Menus
      2. A Mobile-Frienly Menu
    8. Accessibility
  6. CSS Background Tricks
    1. Rounded Corner Boxes
      1. Fixed-width Rounded Corner Boxes
      2. Rounded Corners with CSS
      3. Mountaintop Corners
    2. Exercise: Creating a Rooftop Panel
    3. Tabbed Navigation
    4. Exercise: Tabbed Navigation: Rounding the Corners
    5. Drop Shadows
      1. CSS Drop Shadows: The box-shadow Property
    6. CSS Sprites
    7. Background Opacity and Images
      1. The opacity Property
    8. Exercise: Using HSL and Opacity
      1. Backgrounds
    9. Exercise: Multiple Background Images with background-clip,
    10. background-origin, and background-size
  7. Laying out and Styling Forms with CSS
    1. Laying out the Questions
    2. Creating the Form
      1. HTML
      2. Form Fields
    3. Adding the Form Fields
    4. Reset Revisited
    5. Styling the Form
    6. Exercise: Expanding the Form
  8. CSS Best Practices
    1. Considerations
    2. Use CSS
    3. Use External Style Sheets
    4. Organize Your Style Sheets/Preprocessors
    5. Exercise: Using Sass
    6. ID the Body
    7. Use CSS Shorthand
    8. Combine CSS Rules
    9. Use a CSS Reset
    10. Use the "LoVe HAte" Rule
    11. Use HTML Lists for Navigation Menus
    12. Avoid CSS Hacks
    13. Use a CSS Compressor
    14. Use a Master Style Sheet
    15. Summary of Best Practices
  9. Browser-compatibility Issues
    1. Quirks Mode
      1. Controlling Browser Modes
      2. Design Strategy
    2. Internet Explorer Conditional Statements
    3. Common Browser Bugs / Issues
      1. Positioning Legends

Requirements

Hardware Requirements:

  • This course can be taken on either a PC or Mac.

Software Requirements:

  • PC: Windows 8 or newer.
  • Mac: OS X Snow Leopard 10.6 or later.
  • Browser: The latest version of Google Chrome or Mozilla Firefox are preferred. Microsoft Edge and Safari are also compatible.

Other:

  • Email capabilities and access to a personal email account.

Prerequisites

There are no prerequisites to take this course.

Instructor

Self Study

Reviews

About ExpertRating

ExpertRating is an ISO 9001:2015 certified company offering online certification and training services to individuals and companies globally. Over 25 million people have benefited from ExpertRating Online Certifications and assessments. ExpertRating is the winner of the Google SME Hero's award for showing outstanding use of technology in delivering trusted services to thousands of people on a daily basis. Our affordable certifications are an excellent way of demonstrating your knowledge and skills to prospective employers as well as vastly boosting your chances of moving ahead in your business or career.

Company Timeline

Since 2001

Decades of excellence

800+ Skill Tests

World’s largest test inventory

2500+ Companies

Thousands depend on use

25 Million People Tested

10 tests every minute

35 Countries Serviced

Over 1500 clients in the US

86% Reorder Rate

Satisfied clients

We deliver over 3 million online certification tests and online courses annually.

Awards

ExpertRating is a winner of the Google SME Heroes award. This award has been instituted by Google to honor IT companies that have excelled in their domain and have leveraged the internet to grow and expand their businesses in innovative ways.


ExpertRating is an ISO 9001:2015 certified company, which reflects that our courses and tests conform to the highest international quality standards. Our training material is prepared by thorough professionals with years of experience, and goes through several rounds of analysis by expert teams to help develop well-balanced, comprehensive and meaningful content.