FSD Front-end Development: Advanced CSS Browser Features

HTML5/CSS3    |    Intermediate
  • 13 Videos | 1h 11m 45s
  • Includes Assessment
  • Earns a Badge
Likes 14 Likes 14
In this 13-video course, discover the browser features that are important to full stack developers and how CSS (Cascading Style Sheet) preprocessors make adding styles to a web page and web site easier, especially when the site becomes large. Begin with custom elements and creating new HTML tags. Then take a look at the Shadow DOM (Document Object Model), and avoid conflict by creating separate DOM elements. Next, explore HTML templates, and writing markup that is not rendered. Learn about Cross-Origin Resources Sharing (CORS), which leads to setting up and installing Sass preprocessor, and using variables and nesting to speed up CSS development. Learn how to set up and install LESS, a CSS preprocessor, and then examine workings of LESS variables and mixins (functions allowing reuse of properties). Discover how to use LESS Scope to confine variables, add an operation, and implement a function. Then learn how to install Stylus by using Node.js, and then write simple markup with Stylus. Close the course with an exercise on using LESS mixins to combine styles into a nest pattern.

WHAT YOU WILL LEARN

  • identify the role of the browser in web development and use CSS without actual CSS markup
    create new HTML tags
    avoid conflict by creating separate DOM elements
    write markup that is not rendered
    prevent CORS errors
    set up and install Sass preprocessor
    use variables and nesting to speed up CSS development
  • set up and install LESS preprocessor
    demonstrate how variables and mixins work
    use scope to confine variables, add an operation, and implement a function
    install Stylus using Node.js
    write simple markup with Stylus
    use LESS mixins to combine styles into a nest pattern

IN THIS COURSE

EARN A DIGITAL BADGE WHEN YOU COMPLETE THIS COURSE

Skillsoft is providing you the opportunity to earn a digital badge upon successful completion of this course, which can be shared on any social network or business platform

Digital badges are yours to keep, forever.

YOU MIGHT ALSO LIKE

COURSE FSD Front-End Development: Using JavaScript Functions
Likes 10 Likes 10  
COURSE Design Patterns in JavaScript: Module, Revealing Module, Façade, Decorator, & Mixin Structural Patterns
Likes 18 Likes 18  
COURSE JavaScript: Working with the DOM & Events
Likes 36 Likes 36  

PEOPLE WHO VIEWED THIS ALSO VIEWED THESE

COURSE HTML5 with JavaScript & CSS3: Advanced CSS
Likes 15 Likes 15  
COURSE JavaScript: Functions & Arrays in JavaScript
Likes 172 Likes 172  
COURSE Cloud Computing Fundamentals: Introduction
Likes 1176 Likes 1176