Webszerkesztés
Billentyűparancsok
A VSC kezelését tovább egyszerűsíti a billentyűparancsok használata. Az alábbiakban bemutatott egyedi gyorsbillentyűket én határoztam meg, van ahol új parancsot vettem fel, van ahol a régit lecseréltem. A feladatok megoldásai ezek alapján vannak megadva, ezért először a billentyűparancsok felvétele szükséges!!!
Billentyűparancsok megadása/módosítása
Billentyűparancsok (Keyboard Shortcuts) ablak megnyitása:
Kezelés - Billentyűparancsok menü vagy: C+k,s.
Írd be a keresett parancs nevét, ha billentyűkombinációt szeretnél hozzá adni,
vagy írd be a keresett billentyűkombinációt, ha ellenőrizni szeretnéd, hogy foglalt‑e a billentyűkombináció.
A listából a szükséges sort kiválaszthatod dupla kattintás az egérrel,
vagy Q, Z billentyűvel lépj a keresett sorra, megnyitása: N.
A megjelenő ablakban üsd le a használni kívánt billentyűkombinációt, visszajelzést kapsz, ha már más parancs is használja azt, az N leütésével mentheted a billentyűkombinációt.
A Keyboard Shortcuts ablakban a felhasználó által megadott/módosított parancsoknál a Forrás oszlopban a User felirat jelenik meg.
Billentyűkombinációk
Amennyiben egy billentyűkombinációt kell leütnöd, akkor a vezérlőbillentyű(ke)t le kell nyomnod és nyomva kell tartanod, amíg a további egy vagy két egyéb megadott billentyűt leütöd.
Vezérlőbillentyűk: C A F
A vezérlőbillentyűk után a betűk, számok és funkció billentyűk mellett az N és a navigáló billentyűk is leüthetők.
Funkció billentyűk: Ó - ő
Navigáló billentyűk: H M X Y Q Z
Billentyűkombinációk leütése
Egy vezérlőbillentyű és egy egyéb billentyű:
(Az animáció indításához/leállításához kattints a képen!)
Két vezérlőbillentyű és egy egyéb billentyű:
(Az animáció indításához/leállításához kattints a képen!)
Egy vezérlőbillentyű és két egyéb billentyű:
(Az animáció indításához/leállításához kattints a képen!)
Három vezérlőbillentyű és egy egyéb billentyű:
(Az animáció indításához/leállításához kattints a képen!)
Mozgás és kijelölés a tartalomban szimpla kurzor esetén
Mozgás:
C+X , C+Y
C+A+X , C+A+Y
Kijelölés:
C+F+X , C+F+Y
C+F+A+X , C+F+A+Y
Multikurzor
A multikurzor - többsoros kurzor - segítségével az azonos módon formázandó részek jelölhetők ki, ezt követően az összes kijelölt rész módosítása egy lépésben megoldható.
Az egymás alatti sorok multikurzorral történő megjelölése attól különbözik a több sor együttes kijelölésétől, hogy itt minden kurzorral megjelölt sor különálló kijelölésnek számít.
Multikurzor létrehozásához az A billentyű lenyomása és nyomva tartása mellett, minden szükséges pozícióhoz a bal egérgombbal kell kattintani.
Egymás alatti sorokhoz billentyűvel is adható multikurzor. Ehhez lépj az első sorba, majd a kurzort bővítheted lefelé a C+A+Z, felfelé a C+A+Q billentyűkombinációval.
Több sor kijelölése
Multikurzor
Mozgás és kijelölés a tartalomban multikurzor esetén
Mozgás:
C+A+X , C+A+Y
Kijelölés:
C+F+A+X , C+F+A+Y
Sorok mozgatása, másolása
Az aktuális sort, vagy a kijelölt sorokat mozgathatjuk, másolhatjuk:
Mozgatás lefelé: A+Z
Mozgatás felfelé: A+Q
Másolás lefelé: A+F+Z
Másolás felfelé: A+F+Q
Kijelölés bővítése, szűkítése
Bővítés: Emmet: Balance (outward): A+o
Sorrend: aktuális jelölő tartalma, aktuális jelölő, szülő jelölő tartalma, szülő jelölő...
Szűkítés: Emmet: Balance (inward): A+i
Sorrend: aktuális jelölő tartalma, gyermek jelölő, gyermek jelölő tartalma...
Elemek és attribútumok kijelölés
Következő elem vagy attribútum: A+n
Sorrend: nyitó jelölő, attribútum név és érték pár (ha van), attribútum érték..., következő nyitó jelölő...
Előző elem vagy attribútum: A+e
Sorrend: attribútum érték...(ha van), attribútum név és érték pár, előző nyitó jelölő...
Becsomagolás rövidítéssel
Wrap in HTML tags
Jelöld ki a szükséges tartalmat a megadott HTML fájlban. Az A+w leütésére alapértelmezetten elhelyezésre kerül a kijelölt rész köré egy bekezdés nyitó és záró jelölője, a jelölőnév ki van jelölve, átírással módosítható.
Egy szóköz leütésére a kurzor csak a nyitó jelölőnév mögé kerül, ide írhatod a szükséges attribútumokat.
Az attribútumok beírása nem rövidítéssel történik! Multikurzorral is működik!
Emmet: Wrap with Abbreviation
Kijelölés nélkül az aktuális jelölő köré, kijelölés esetén a kijelölés köré illeszti be a szerkesztőmezőben megadott jelölő nyitó és záró részét.
A szerkesztőmezőben a nyitó jelölő attribútumai is megadhatók, rövidítésekkel.
Multikurzorral is működik!
Szerkesztőmező megnyitása: C+b,r.
HTML elemnevek: ul, li, p, b, i
Az attribútumokat [ és ] közé kell írni: a[href=index.html]
Az attribútumokat szóközzel kell elválasztani: a[href=index.html target=_blank]
Az értékeket csak akkor kell idézőjelbe tenni, ha az érték több szóból áll.
Amennyiben egy e-mail-cím van kijelölve, a rövidítés: a;
eredmény: <a href="mailto:_email-cím_">email-cím</a>
(Az animáció indításához/leállításához kattints a képen!)
Becsomagolás multikurzorral:
(Az animáció indításához/leállításához kattints a képen!)
Elem eltávolítása
Emmet: Remove Tag
A kurzor pozíciójának megfelelő nyitó és záró jelölő kerül eltávolításra a C+e,e leütésére.
Egyéb billentyűparancsok
Az aktuális kijelölés következő előfordulásának kijelölése is: C+d
A kijelölés összes előfordulásának kijelölése:
C+Ő vagy C+F+l
Aktuális sor kijelölése: C+l
Aktuális sor törlése: C+F+k
Ugrás a kijelölés következő előfordulására: Á
Ugrás a kijelölés előző előfordulására: F+Á
IntelliSense
Az IntelliSense „kódkiegészítés”, „tartalomsegítő”.
Az IntelliSense bármely szerkesztőablakban aktiválható a C+S billentyűkombináció beírásával.
HTML fájlokban
Attribútumok:
Attribútum értékek:
Fáj nevek: Kép esetén a képek közül, link esetén a html fájlok közül kell választani:
Szavak: A megnyitott fájlban található szavak:
CSS fájlokban
Tulajdonságok:
Értékek:
A listában a Q és a Z billentyűkkel lépkedhetsz, az aktuális listasor kiválasztása: N leütésével.