{"id":3387,"date":"2014-08-25T10:44:22","date_gmt":"2014-08-25T13:44:22","guid":{"rendered":"http:\/\/blog.turbosite.com.br\/?p=3387"},"modified":"2014-08-25T10:44:22","modified_gmt":"2014-08-25T13:44:22","slug":"editor-de-texto-atom-com-a-extensao-emmet","status":"publish","type":"post","link":"https:\/\/www.turbosite.com.br\/blog\/editor-de-texto-atom-com-a-extensao-emmet\/","title":{"rendered":"Editor de texto Atom com a Extens\u00e3o Emmet"},"content":{"rendered":"

J\u00e1 fizemos uma fizemos uma breve apresenta\u00e7\u00e3o ao\u00a0editor de texto Atom<\/a>\u00a0da GitHub<\/a>, se voc\u00ea n\u00e3o leu, clique aqui<\/a>. Hoje vamos falar sobre uma das extens\u00f5es dispon\u00edveis para o Atom.<\/p>\n

Emmet<\/strong>. Esta \u00e9 uma extens\u00e3o que vai ajudar\u00a0a criar c\u00f3digos HTML e CSS mais rapidamente, ganhando at\u00e9 80% a mais de agilidade na escrita destes c\u00f3digos.<\/p>\n

\"extensao-emmet-atom-turbosite\"<\/p>\n

A extens\u00e3o\u00a0Emmet<\/a>\u00a0\u00e9 muito conhecida\u00a0pelos\u00a0desenvolvedores web, pois, permite aumentando a produtividade com escrita de c\u00f3digos.<\/p>\n

Com esta extens\u00e3o, s\u00e3o ativadas diversas funcionalidade, voc\u00ea ser\u00e1 capaz de escrever HTMLcom marca\u00e7\u00f5es CSS. Se, por exemplo, escrevermos isto:\u00a0\u00a0ul<\/span>#minha_lista>li*5<\/span><\/span><\/span>\u00a0e clicarmos na tecla \u201ctab\u201d ou “CTRL+E” no Windows, o seguinte ser\u00e1 produzido:<\/p>\n

\n
\n
XHTML<\/span><\/div>\n<\/div>\n
<\/div>\n
\n\n\n\n
\n
\n
1<\/div>\n
2<\/div>\n
3<\/div>\n
4<\/div>\n
5<\/div>\n
6<\/div>\n
7<\/div>\n<\/div>\n<\/td>\n
\n
\n
<ul <\/span>id<\/span>=<\/span>“minha_lista”<\/span>><\/span><\/div>\n
<li><\/span><\/li><\/span><\/div>\n
<li><\/span><\/li><\/span><\/div>\n
<li><\/span><\/li><\/span><\/div>\n
<li><\/span><\/li><\/span><\/div>\n
<li><\/span><\/li><\/span><\/div>\n
<\/ul><\/span><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

No v\u00eddeo abaixo, voc\u00ea poder\u00e1 conferir como instalar a extens\u00e3o al\u00e9m de, \u00a0mostrar como funciona o sistema de abreviaturas e alguns atalhos.
\nV\u00eddeo exibido em Coxpe<\/a>.<\/p>\n