Cum funcționează?
Apăsați în prealabil combinația de taste presetate și veți obține:
Nu-i rău, nu-i așa? =)
- Text sublim
- atom
- Eclipse / Aptana
- TextMate
- Chocolat
- Komodo Edit
- Notepad ++
- Console
- NetBeans
- Adobe Dreamweaver
Lista completă poate fi găsită aici.
Instalarea lui Emmet în text sublim 3
Mai întâi, descărcați arhiva cu pluginul. și rasorziviruyte conținutul în dosarul Pachete, pentru a afla unde este, deschideți Text sublim. și faceți clic pe elementul "Răsfoiți pachetele" din meniul Preferințe.
Reporniți la Sublimare. care va verifica lucrul, introduceți "div" și apăsați "Ctrl + e", dacă totul este bun, atunci se pot întâmpla două lucruri.
- Pluginul va funcționa și linia "div" se va extinde la " "
- Va apărea un mesaj pe care trebuie să îl așteptați în timp ce "PyV8" este descărcat, nu trebuie să vă faceți griji, așteptați doar câteva minute și încercați din nou
Instalarea lui Emmet în Notepad ++
- Descoperiți N ++
- În meniul Pluginuri, executați "Managerul de pluginuri -> Afișați managerul de plajă"
- În lista de plug-in-uri găsiți "Emmet", selectați-l și faceți clic pe "install"
- Managerul de pluginuri va sugera, de asemenea, instalarea "scriptului Python", suntem de acord.
- După o încărcare scurtă, va trebui să reporniți N ++.
- Acum, hai să mergem în opțiunile -> taste rapide -> comenzile Plugin ".
- Pentru munca, avem cel puțin nevoie pentru a seta hotkey pentru «Extindere abreviere» și «înveliți cu abreviere» (implicit este «Ctrl + Alt + Enter» și «Ctrl + Alt + Shift + Enter», care nu este foarte convenabil) , Am pus "Alt + Z" și "Ctrl + Alt + Z", aici trebuie să fii atent, această combinație nu trebuie ocupată.
- Încercați să introduceți "div" și extindeți abrevierea "Alt + Z", dacă totul este bun, atunci obținem " "
Dacă Emmet nu merge
dacă apare eroarea "Excepție necunoscută", înseamnă că trebuie să actualizați "scriptul Python", descărcați-l aici. setați ca un program normal și bucurați-vă =)
Comenzi Emmet
Nu am fost foarte fericit de a conduce în principalele tag-uri pentru document HTML de fiecare dată, înainte de a pur și simplu a avut loc în șablonul de magazin, care este copiat în directorul de destinație și pentru a începe lucrarea, simplifică foarte mult Emmet, putem intra:
Extindeți reducerea și obțineți
Dacă nu utilizați Html 5, puteți utiliza și "html: xt" pentru XHTML și "html: 4s" pentru HTML4.
Dacă vrem doar să aducă o etichetă separată, apoi, respectiv, scrie numele său, în timp ce noi nu trebuie să vă faceți griji cu privire la eticheta de închidere și atributele necesare, Emmet-l suportă.
După cum probabil ați înțeles deja, "+" ajută la afișarea a două etichete consecutive. Pentru a obține eticheta imbricată, utilizați operatorul ">". De exemplu, de la reducere
după dezvăluire se va dovedi
Pentru a repeta un element de câteva ori folosind operatorul "*", un pic din exemplul anterior și obțineți:
Pentru a nu se confunda în atașamente, etichetele pot fi grupate:
Dacă trebuie să afișați alte atribute, utilizați paranteze pătrate:
Contururile curry sunt folosite pentru a genera conținut:
Și dacă ar trebui să le oferim diferite clase (sau conținut diferit) atunci când derivăm mai multe elemente prin înmulțire? Acest lucru este posibil, de asemenea
Dacă vrem să schimbăm numărul inițial, scrieți "$ n", unde n este numărul din care să începem să numărăm.
Pentru a număra până la o scădere, după "$" trebuie să adăugați "@"
Uneori se întâmplă ca o anumită etichetă să fie ridicată la nivelul (câteva nivele) în sus. Operatorul "^" vă va ajuta. Să presupunem că conducem o structură HTML pentru antetul site-ului:
Emmet are încă un lucru pe care îl puteți apela un nume implicit al etichetei:
La ce, emmet însuși poate înțelege ce etichetă să înlocuiască în funcție de situație
Ultimul lucru pe care aș dori să-l vorbesc despre HTML, nu putem numai să implementăm comanda Emmet la un cod HTML, ci și să înfășurăm text obișnuit cu etichete HTML.
În situația standard, realizăm antetul site-ului și copiați textul pentru elementele de meniu din Photoshop:
Prescrierea pentru fiecare element de meniu poate fi, și mulți o fac, dar să încercăm să accelereze, utilizați comanda «infasoara Abreviere» (în sublim - Shift + Ctrl + G la N ++ -. Alt + Ctrl + Z), iar în fereastra care apare, scrie :
dupa care primim:
Emmet va face toată munca pentru noi, spiritul a fost deja confiscat, din oportunitățile deschise?)
Foarte des, în timpul aspectul de așa-numitul „Fish“, adică, textul lipsit de sens care apare în acest șablon este semnificativ mai bun decât un set haotic de litere în Emmet are un generator încorporat.
Puteți să limitați numărul de cuvinte afișate:
Dezasamblarea principală, în afară de HTML, Emmet vă permite, de asemenea, să scurtați introducerea codului CSS, deși aici totul nu este atât de cool.
Puteți introduce prima literă a oricărei proprietăți și o valoare:
Dacă pixelii nu vă plac, atunci sunt posibile și alte opțiuni:
• p →%
• e → em
• x → ex
Multe proprietăți încep cu o singură literă, pentru clarificare, puteți scrie primele litere sau câteva litere, Emmet va încerca să găsească cea mai potrivită opțiune:
Emmet A tipărit o proprietate cu prefixe pentru browserele principale, deoarece este încă destul de nouă. Dacă doriți să adăugați prefixe pentru orice altă proprietate, trebuie să introduceți o liniuță înainte: