Using CSS abbreviations

Emmet is not just great for HTML, it can also help you write your CSS a lot faster.…It does this with a lot of predefined snippets that you can just type in to do code.…So let's try doing a body selector right here.…If we want to add a margin to this, normally, we would type in margin, and…then colon, and then putting a value right here like 10px.…You can do the same thing in Emmet just by typing in m, and then the number that you want.…You don't even have to specify px. It's just going to assume that you need pixels.…So, to do two values of the margins, you do m10 and then - say 20.…

And then it gives you two values, and of course if you want to do four, you would…just do all four numbers in a row. Of course, anything that works with a…margin works with padding as well. And if you want to, you can use different…measurement systems. So you could say something like padding…20, and then either use the % sign and that does percentage or do the p for…percentage and it does the same thing. If you want to use ems, you could use e…

Resume Transcript Auto-Scroll

Author

Released

7/31/2013

Looking for a tool to make you a faster and more efficient programmer? Emmet provides a shortcut language for writing HTML, XML, and CSS, based on an abbreviation structure most developers already use that expands into full-fledged HTML markup and CSS rules. Let Ray Villalobos show you how to install the Emmet plugin for your favorite text editor and start using its handy shortcuts for making copies of elements; climbing, grouping, and numbering; matching tags; and even complex CSS3 features like gradients.