HTML-kodning görs enkelt med Zen-kodning

click fraud protection

Zen-kodning är en av de bästa HTML-kodande assistenter som någonsin har skapats. Förvirrande till en början och kanske lite knepig att ta sig runt, men när du väl tar hand om det kan ingenting slå den lättheten det kommer att leda till en kodares liv.

Zen Coding är i princip en uppsättning plugins som kan fungera med ett stort antal textredigerare (Notepad ++, Coda, Espresso, Aptana, Komodo etc, för att nämna några). Deras specialitet är att utöka förkortningar till kompletta HTML-strukturer, på ett mycket intelligent, otroligt sätt.

bild

HTML-strukturen som visas på skärmdumpen är alla med tillstånd av bara ett par rader, utvidgade av Zen Coding själv. Som syns på skärmdumpen visar plugin-programmet sig själv som en meny i huvudverktygsfältet när det är integrerat med Notepad ++. Detta kan ändras från redaktör till redaktör.

Kommer till en kort översikt av hur detta fungerar, låt oss se hur det första HTML-blocket skapades i ovanstående skärmdump. Kommandot som används visas nedan.

ZEN

Denna enkla syntax styr således. Utvidgningen börjar med en "div" -tagg, och allt efter # kommer att identifiera "id" för den föregående taggen. > Visar hur barntaggar kommer att stiga upp från vilken tagg, som i detta fall är 'tabell', 'tr', 'td' etc. Multiplikatorn med 5 indikerar att den föregående taggen måste upprepas detta många gånger. Slutligen kopplas hyperlänk-taggen till en "klass" också, specificerad genom användning av perioden. Därför översätter den här syntaxen till detta:

instagram viewer

ZEN2

Möjligheterna med Zen Coding är enorma. Det här kommandot som jag berörde ovan kommer inte ens i början. Att ta med lite variation i syntaxen kan åberopa en stor variation i din HTML-utgång. Ta till exempel syntaxen och HTML-utgången nedan.

ZEN

Här har jag bara använt markörerna + för att lägga till mer än en tagg av samma slag, och till och med använt multiplikatorer däremellan.

Att täcka alla funktioner i Zen Coding ligger utanför den här granskningen. Därför välkomnar vi dig att utforska plugin. Zen Coding kan bli livlinjen för alla HTML-kodare, CSS-artister osv. Och kan till och med locka de som bara vill experimentera med den. Du kommer att bli hårt pressad för att hitta någon som har något dåligt med Zen Coding, de är verkligen så bra.

På nedladdningslänken nedan finns ett par skärminspelningar som tillåter en översikt över de funktioner som erbjuds. Kolla in dem.

Zen Coding-plugins är tillgängliga för flera textredigerare över plattformar.

Ladda ner Zen Coding

watch instagram story