FSD Front-end Development: Advanced CSS Browser Features

HTML5/CSS3    |    Intermediate
  • 13 Videos | 1h 6m 15s
  • 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 Web Fundamentals: Web Development with HTML
COURSE FSD Front-End Development: UI Development with ReactJS
Likes 72 Likes 72  
COURSE Design Patterns in JavaScript: Module, Revealing Module, Façade, Decorator, & Mixin Structural Patterns
Likes 18 Likes 18  

PEOPLE WHO VIEWED THIS ALSO VIEWED THESE

COURSE JavaScript: Getting Started with JavaScript Programming
Likes 296 Likes 296  
COURSE SOLID & GRASP
Likes 3218 Likes 3218  
COURSE JavaScript: Types, Operators, & Control Structures in JavaScript
Likes 126 Likes 126