YoVDO

Emmet: Write HTML+CSS Like a Ninja

Offered By: Skillshare

Tags

Emmet Courses Computer Science Courses Web Development Courses HTML Courses Code Efficiency Courses

Course Description

Overview

If you code you’ll either know, or begin to realise, that there’s a lot of repetition that goes on – especially in HTML and CSS. This goal of this class is to show you how to dramatically speed up writing HTML and CSS by using a plugin called Emmet. The class covers the basics, advanced methods, hidden gems, and even more time-saving tools and tips.

Emmet is available for all major code editors!
It even works in places like Code Pen and JS Fiddle.

Once you begin using Emmet you’ll wonder how you lived without it. It’s fast. It’s powerful. And it’s easy to use. You’ll save days or weeks throughout a year when using Emmet.

The class in broken down into short videos, so you can try it on your own – and so you can easily reference them later!

Get you HTML & CSS Ninja on :) Take the class!


If you're looking to get into coding more check out my other coding classes:


Syllabus

  • Class Introduction
  • // GETTING GOING
  • Quick Theory
  • Install Emmet
  • Emmet Installation in Sublime
  • // CSS ABBREVIATIONS
  • Abbreviations With Values
  • What Is The Abbreviation?
  • Gradients
  • Multiple Rules
  • Extra Info
  • Vendor Prefixes
  • Cool Abbreviations
  • // CSS SHORTCUTS
  • Increment Decrement Number
  • Math On The Fly
  • Reflect CSS Value
  • Toggle Comments
  • CSS Preprocessors
  • // HTML ABBREVIATIONS
  • Multiple Classes and IDs
  • Tag Types
  • HTML Attributes
  • Children, Multiplication and Incremental Numbers
  • Siblings And Groups
  • Climb Up
  • HTML Text
  • Lorem Ipsum
  • Unknown Abbreviations
  • Favorite Abbreviations
  • BEM Naming
  • Adding It All Together
  • // HTML SHORTCUTS
  • Balance Tags
  • Split Join Tag
  • Jump to Content Edit Point
  • Select Next & Previous Item
  • Remove Tag
  • Rename Tag
  • Goto Matching Pair
  • Wrap With Abbreviation
  • Toggle Comment
  • Update Image Size
  • // MORE AWESOME EMMET THINGS
  • Encode Image To Data
  • Merge lines
  • The Command Palette
  • Emmet Settings
  • Filters
  • // PRODUCTIVITY WITH SUBLIME
  • Without a Mouse
  • Split Into Lines
  • Tab Navigation
  • Emoji Picker
  • // CONCLUSION

Taught by

Rich Armstrong

Related Courses

Visual Studio Code Crash Course
freeCodeCamp
Emmet: Fast and Efficient Web Coding
LinkedIn Learning
Writing Code Faster with Emmet
Skillshare
Aprende a crear páginas web con HTML5 y CSS3
Udemy
Emmet in Visual Studio Code: Accelerate your HTML workflow
Udemy