Emmet (Software)
Zur Navigation springen
Zur Suche springen
Emmet | |
---|---|
Basisdaten
| |
Entwickler | Sergey Chikuyonok |
Erscheinungsjahr | 2009 |
Aktuelle Version | 1.1 (23. Dezember 2013) |
Programmiersprache | JavaScript |
Lizenz | MIT-Lizenz |
https://emmet.io/ |
Emmet ist ein quelloffenes Plugin für verschiedene Texteditoren, zur schnellen Erstellung von XML-, HTML- und CSS-Code.[1]
Befehle für Emmet werden in einer eigenen Kurzschreibweise verfasst und direkt in der Datei ausgeführt, zum Beispiel durch das Drücken der Tabulatortaste. Das Plugin wandelt die Kürzel im Texteditor sofort in normalen Code um, der wie gewohnt gespeichert und verwendet werden kann. Emmet war früher unter dem Namen Zen Coding bekannt.[2]
HTML-Beispiele
[Bearbeiten | Quelltext bearbeiten]Einfaches Beispiel
[Bearbeiten | Quelltext bearbeiten]Emmet-Anweisung:
html>head+body
HTML-Ausgabe:
<html>
<head></head>
<body>
</body>
</html>
Komplexeres Beispiel
[Bearbeiten | Quelltext bearbeiten]Emmet:
ul.gallery>(li>a[href="img/$$$.jpg"]{Bild $$$})*3
HTML:
<ul class="gallery">
<li><a href="img/001.jpg">Bild 001</a></li>
<li><a href="img/002.jpg">Bild 002</a></li>
<li><a href="img/003.jpg">Bild 003</a></li>
</ul>
CSS-Beispiele
[Bearbeiten | Quelltext bearbeiten]Emmet-Anweisung:
pos.a
CSS-Ausgabe:
position:absolute;
Emmet:
ff:a
CSS:
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
Erweiterungen
[Bearbeiten | Quelltext bearbeiten]Das Plugin kann durch JS- und JSON-Dateien erweitert und angepasst werden.[3]
Weblinks
[Bearbeiten | Quelltext bearbeiten]- Offizielle Website (englisch)
- Emmet auf GitHub (englisch)
- Emmet Kurzreferenz (englisch)
Einzelnachweise
[Bearbeiten | Quelltext bearbeiten]- ↑ Emmet auf GitHub: emmet/README.md at master · emmetio/emmet · GitHub (englisch) Abgerufen am 23. Juli 2014
- ↑ Smashing Magazine: Goodbye, Zen Coding. Hello, Emmet! (englisch) Abgerufen am 23. Juli 2014
- ↑ Emmet: Customization (englisch) Abgerufen am 23. Juli 2014