Programa mas rapido con emmet

Emmet en Netbeans 8.2, 9 y 10 [Como programar mas rapido]

Programa%2Bmas%2Brapido%2Bcon%2Bemmet

INTRODUCCIÓN

Hay varias formas de programar mas rápido hoy en dia y una de ella son los famosas hot-key o atajos de teclado y una herramienta que nos ayuda a implementar estas hot-key es emmet.

Emmet es un pluging  que se instala en nuestro IDE y que nos ayuda a gestionar nuestros hot-keys

Emmet es compatible con varios IDES entre ellos están:
-Sublime Text.
-Atom.
-Coda.
-Eclipse/Aptana.
-TextMate 2.
-Expresso
-Netbeans (No puede faltar).
Y 20 ides mas que podemos encontrar en esta url: https://emmet.io/download/

En este tutorial vamos a aprender a instalar y a configurar emmet en netbeans 8, pero tambien es compatible con netbeans 9, 10 y 11.

PROCEDIMIENTOS

Url del pluging de emmet https://emmet.io/download/

Despues de colocar el texto debemos presionar

ctrl+alt+n
!
<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>

    </body>
</html>
meta:vp
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
link:css
<link rel="stylesheet" href="style.css">
ul>li{item $}*5
<ul>
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    <li>item 4</li>
    <li>item 5</li>
</ul>
header>nav#id-menu.class-menu>ul>li{item $}*5>a:link
<header>
    <nav id="id-menu" class="class-menu">
        <ul>
            <li>item 1<a href="http://"></a></li>
            <li>item 2<a href="http://"></a></li>
            <li>item 3<a href="http://"></a></li>
            <li>item 4<a href="http://"></a></li>
            <li>item 5<a href="http://"></a></li>
        </ul>
    </nav>
</header>
section>article>p{lorem}*2
<section>
    <article>
        <p>lorem</p>
        <p>lorem</p>
    </article>
</section>
footer#pie.class-pie>p{Copyrigth 2019}
<footer id="pie" class="class-pie">
    <p>Copyrigth 2019</p>
</footer>
a:link[target=_blank]

<a href="http://" target="_blank"></a>

Url plugin para netbeans: http://plugins.netbeans.org/plugin/48315/
Url de lista de abreviaturas: https://docs.emmet.io/cheat-sheet/

Ads Blocker Image Powered by Code Help Pro

Ads Blocker Detected!!!

En Programador Novato vivimos de los anuncios, hemos detectado que está utilizando extensiones para bloquear anuncios. Ayudanos deshabilitando tu bloqueador de anuncios. :)