. Da biste dodali oznaku na kraj konstrukcije, upotrijebite operator +, tj. div+p će biti onda ga slijedi. Za prelazak na višu razinu morate koristiti operator ^
Kako postaviti sadržaj unutar oznake?
Da biste to učinili, koristite () zagrade, tj. div+p(Hello world) nakon pritiska Tab dobivamo
Pozdrav svijete
, i () zagrade koriste se za grupiranje elemenata
Kako dodati id atribut oznaci?
Za postavljanje ID-a u emmet koristimo #, div#firs_id.first_class koji dobivamo
. Za postavljanje drugih atributa koriste se uglate zagrade - unutar njih su naznačeni potrebni atributi.
Postoji funkcija povećanja, na primjer, trebamo popuniti id oznake a od 1 do 5, za to koristimo sljedeću konstrukciju div>a#$*5 zbog čega će svi id-ovi oznake a biti ispunjeni vrijednostima od 1 do 5
Također bih želio dodati da Emmet može raditi sa CSS-om na isti način, samo u Sublime Textu mora biti odabrana CSS sintaksa, Emmet zna sva svojstva CSS-a i samo napišite prvo slovo svojstva i pritisnite Tab, ili možete također odredite prvo slovo i traženu vrijednost, na primjer m20 + Tab će ispisati sljedeću marginu rezultata: 20px;
Ako netko iznenada ima bilo kakvih pitanja, postavite ih u komentarima, rado ću odgovoriti na njih.
Još uvijek pišete oznake? html I css svojstva ručno? Vrijeme je da to popravimo! Danas ćemo govoriti o dodatku mrav, koji će nam u tome pomoći.
Mrav- Ovo uključiti koji će vam omogućiti pisanje html I css deset puta brže. Mnogi ljudi ga već koriste u svojim projektima, ali mnogi još uvijek ne znaju ništa o tome, a danas ću pokušati to popraviti.
Prvo ga trebate instalirati. U Uzvišeni tekst, o čemu je nedavno pisano, to se radi vrlo jednostavno. Otvoren komandna paleta pritiskom na tipkovni prečac cmd+shift+p, ili idite na alata i tamo odaberite komandna paleta. Sada uđi "instalacijski paket" i pritisnite Unesi. Zatim unesite "mrav" i ponovno pritisnite Unesi. Nakon što se dodatak preuzme i instalira, ponovno pokrenite Uzvišeni tekst.
Instalacija je završena i sada možemo početi koristiti dodatak mrav. Unesi
Sada pritisnite tipku tab. Kao rezultat ovih jednostavnih koraka dobit ćemo oznaku za otvaranje i zatvaranje div, a kursor će biti postavljen unutra, između njih.
Isto možete učiniti s bilo kojim oznakama. Na primjer, stvorimo vezu.
Sada kliknite tab, i dobivamo sljedeće
Sada pogledajmo kako dodati klase I iskaznica. To se radi na potpuno isti način kao u css: korištenje klase .
, i id koristeći #
Kao rezultat dobivamo
Isto je i sa iskaznica
Dobivamo sljedeće
Primjetite da nisam ja napisao riječ div, nego sam jednostavno stavio točku ili crtu i napisao ono što mi treba Klasa ili iskaznica. Poanta je da možemo preskočiti naziv oznake i onda mrav on će smisliti koju oznaku staviti. U većini slučajeva to će biti div, ali ako, na primjer, ovo napišete unutar oznake ul, tada će oznaka biti li s pravom razreda ili iskaznica.
Ako želite sami unijeti neki atribut, napišite ga u uglatim zagradama
Dobivamo sljedeće
Za ugniježđivanje oznaka unutar drugih oznaka morate koristiti znak veće od
Dobivamo sljedeće
Korištenje simbola *
možete odrediti koliko takvih oznaka trebamo
To je ono što dobivamo
Ako trebate dodati oznaku na istoj razini, upotrijebite znak +
#kontejner>.lijevo+.desno
Proizlaziti
Korištenje simbola $
možemo odrediti da se svaka oznaka automatski numerira
Ul>li.stavka$*5
Proizlaziti
Ako trebate početnu nulu, upišite znak $
2
puta ako 2
vodeća nula, dakle 3
znak $
itd.
Ako želite dodati tekst unutar oznake, morate ga navesti u vitičastim zagradama
A (malo teksta)
Proizlaziti
Neki tekst
Ako vam tijekom izgleda treba tekst, samo napišite lorem
Proizlaziti
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quae, mollitia quibusdam voluptatibus fuga dolorem officiis animi error ex ea ipsa exceptionuri incidunt quis sunt ducimus rerum corrupti obcaecati ipsum quisquam.
Ako trebate određeni broj riječi, napišite broj koji označava broj riječi iza.
Proizlaziti
Lorem ipsum dolor.
Stvoriti html struktura, samo napišite znak !
!
Proizlaziti
Dokument
Sada razgovarajmo o tome kako mravće nam pomoći u css
Tamo samo trebate napisati početna slova svojstva i vrijednost, a zatim kliknuti tab. Na primjer
Kao rezultat dobivamo
Margina: 10px;
Neka svojstva već imaju zadane vrijednosti. Na primjer, u svojstvu poravnanje teksta
Proizlaziti
Poravnanje teksta: lijevo;
Ali možete ga promijeniti jednostavnim pisanjem slova vrijednosti nakon kratice svojstva. Na primjer, neka bude u središtu.
Proizlaziti
Poravnanje teksta: središte;
Nema smisla sve razmatrati. Dokumentacija o dodacima mrav možete pronaći ovdje: http://docs.emmet.io/cheat-sheet/
Na kraju, vrijedi reći da ako vam se iz nekog razloga ne sviđa ključ tab, tada ga možete promijeniti. Da biste to učinili, idite na sljedeći put: Preferencije->Postavke paketa->Mrav->Vezivanje tipki - zadano. Koristite pretraživanje ( cmd+f ili slijedite put Traži->Traži) Koristite pretraživanje da pronađete naredbu "expand_abbreviation_by_tab". Iznad nje, u nizu ključevi, napisano pod navodnicima "tab". Promijenite ovu vrijednost u svoju, na primjer u "ctrl+e". Ali to nije sasvim točno. Bit će bolje ako cijeli ovaj objekt kopirate i zalijepite u datoteku Vezovi tipki - korisnik, a zatim promijenite tipkovni prečac. To je učinjeno tako da ako se nešto dogodi, možete vratiti sve postavke zadano pomoću datoteke Vezivanje tipki - zadano.
Znaci to je to. Danas smo pogledali dodatak mrav za uređivač teksta Uzvišeni tekst. Ako koristite neki drugi uređivač, potražite ovaj dodatak za njega na internetu. Sretno!
U ovom članku ćemo preuzeti, instalirati na Windows i rusificirati Sublime Text 3, također ga aktivirati pomoću Licencnog ključa i instalirati Emmet na njega.
Preuzmite Sublime Text 3
Subline Text 3 možete preuzeti s web stranice sublimetext.com ili s mog Yandex diska (preporučujem ga, jer sam ga instalirao, rusificirao i aktivirao, i tamo ćete pronaći ključeve i rusificiranje).
Instaliranje Sublime Text 3
Instaliranje Subline Text 3 je vrlo jednostavno, da biste to učinili, samo ga pokrenite i kliknite na sljedeći gumb, neću se zadržavati na ovome, mislim da nitko neće imati problema s ovim.
Rusifikacija uzvišenog teksta 3
Raspakirajte arhivu ( SublimeText3RussianMenu.zip) i kopirajte mapu Zadano V " c:\Users\Korisničko ime\AppData\Roaming\Sublime Text 3\Packages\» (Put za Windows 7/8/10)
Aktivacija Sublime Text 3
Da biste aktivirali Subline text 3, otvorite tekstualni dokument Licencni ključ
, kopirajte jedan od ključeva iz njega, zatim pokrenite Subline i idite na " Referenca» (« Pomozite«) - « Unesite licencu» (« Unesite licencu") umetnite ključ i kliknite " Koristite licencu»
Instaliranje Emmeta na sublime text 3 i dodavanje kontrole paketa u njega.
Pokrenite uređivač i pritisnite Ctrl+ ili “ Pogled» — « Prikaži/sakrij konzolu» (« Pogled» — « Prikaži konzolu"), nakon čega će se na dnu otvoriti ploča za unos, u nju umetnite kod ispod, kliknite " Unesi", pričekajte malo i ponovno pokrenite uređivač.
Uvezi urllib.request,os,hashlib; h = "df21e130d211cfc94d9b0905775a7c0f" + "1e3d39e33b79698005270310898eea76"; pf = "Kontrola paketa.sublime-package"; ipp = sublime.installed_packages_path(); urllib.request.install_opener(urllib.request.build_opener(urllib.request.ProxyHandler())); by = urllib.request.urlopen("http://packagecontrol.io/" + pf.replace(" ", "%20")).read(); dh = hashlib.sha256(by).hexdigest(); print("Pogreška provjere preuzimanja (dobio %s umjesto %s), pokušajte ručno instalirati" % (dh, h)) if dh != h else open(os.path.join(ipp, pf), "wb" ).write(by)
Sada idite na karticu " Mogućnosti» — « "ili pritisnite kombinaciju tipki" Ctrl» + « Shift» + « P“, nakon čega će nam iskočiti prozor u kojem odabiremo “ Instalirajte paket“ (ako se ne varam, redak 6).
Nakon čega će vam iskočiti drugi prozor u koji trebate unijeti “ Mrav“, pojavit će se puno ponuda, kliknite na prvu (gdje ste upravo Mrav).
Pričekamo malo dok se ne otvori kartica sa sadržajem koji je Emmet uspješno instaliran, zatvorimo sve kartice i ponovno pokrenemo uređivač. Sve se može koristiti!
U tri riječi, kako Emmett radi
Dat ću vam nekoliko primjera za Mrav. Recimo da nam treba osnovni okvir web stranice html5, da biste to učinili, samo unesite "!" i pritisnite "Tab".
Za brzu izgradnju, na primjer, bloka s klasom stupac-sm-6, morate unijeti " .col-sm-6" i pritisnemo "Tab", dobivamo "
»
Da biste izgradili nešto poput ovoga:
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt natus quidem qui, obcaecati dolorem optio nulla voluptates suscipit eligendi laboriosam quisquam odio provident facilis laudantium. Non, tempora mollitia consequuntur laborum!
Incidunt fugiat beatae non voluptatum at iste inventore obcaecati rem tenetur officiis reprehenderit soluta, magnam est consequatur acceptantium, fuga aperiam nesciunt exercitationem dignissimos aut, ut. Voluptatibus id explicabo, suscipit porro.
Iste magni, nam id a, maxime incidunt aperiam hic, aliquid suscipit aspernatur maiores quaerat sequi asperiores perferendis eum delectus consectetur sint exceptionuri laboriosam, error. Ratione voluptatum similique sunt sequi maiores!
Officiis doloremque cumque ab quae similique totam voluptates? Molestias rerum eos dolor nulla quidem nam pariatur, quisquam reiciendis tenetur. Dolorum, at, illum! Corporis, itaque, impedit repellendus natus Acuzantium sit sunt.
samo unesite ovaj mali redak " .row>.col-md-3*4>lorem" i pritisnite " tab«.
Kao što vidite, Emmet je vrlo cool dodatak koji uvelike ubrzava proces izgleda, glavna stvar je da ga možete ispravno koristiti) Savjetujem vam da pročitate dokumentaciju.
Opis:
Uzvišeni tekst- višeplatformski, napisan korištenjem Pythona i C++, uređivač teksta i uređivač izvornog koda. Program je izvorno razvijen kao višenamjenska Vim ekstenzija. Sublime Text nije besplatan softver ili softver otvorenog koda, ali neki od njegovih dodataka su besplatno licencirani i razvija ih i održava zajednica programera.
Što ima novog:
Dodan novi format datoteke definicije sintakse, .sublime-syntax
Nove definicije sintakse C++, javascript i Rust s poboljšanom preciznošću i performansama
Mnoga druga poboljšanja isticanja sintakse
OSX: Poboljšana izvedba renderiranja, posebno na zaslonima visoke rezolucije
Poboljšano ponašanje prelamanja riječi
Poboljšano ponašanje provjere pravopisa
Poboljšano ponašanje indeksiranja datoteka s više otvorenih prozora
Teme se sada mogu mijenjati u hodu bez artefakata
HTML: Pritiskom na enter kada se nalazi između para oznaka povećat će se uvlaka
Neki su isječci premješteni u poddirektorije, pa će se morati ažurirati prilagođena nadjačavanja i vezanja tipki koje ih upućuju
naredba show_scope_name prikazuje opseg u skočnom prozoru
Razvoj paketa: Dodana varijanta izgradnje "Testovi sintakse - kompatibilnost regularnih izraza" za procjenu izvedbe definicije sintakse
Razvoj paketa: Proširen skup regularnih izraza s kojima novi mehanizam regularnih izraza može rukovati
Definicije sintakse: Popravljeni su neki slučajevi u kojima pop podudaranja s povratnim referencama nisu radila ispravno
Riješeni su neki problemi s rukovanjem Unicodeom u Goto Anything
Popravljen je scenarij u kojem se promjene datoteka .tmPreferences nisu preuzimale
Ispravljena regresija performansi renderiranja 3096
Ispravljena je regresija 3096 u regularnim izrazima kada se koriste \x(nnnn) izlazni znakovi
Riješeno je rušenje koje se moglo dogoditi s nevažećim postavkama result_file_regex
API: Dodan window.status_message
API: promjene načina učitavanja dodataka. Ovo bi trebalo biti transparentno, ali rješava niz problematičnih slučajeva
API: Ažurirano na Python 3.3.6, i sada uključuje _ssl modul na Linuxu, plus sqlite3 i bz2 na svim platformama
API: ažuriran OpenSSL na 1.0.2h
rusifikacija:
Citat:
Kopirajte sve datoteke s ekstenzijom .sublime-menu iz mape SublimeText3RussianMenu u jednu od sljedećih mapa, ovisno o vašem operativnom sustavu, potvrđujući zamjenu (ako ne postoji mapa “Default” na navedenoj stazi, stvorite je):
Windows 7/8 c:\Korisnici\Korisničko ime\AppData\Roaming\Sublime Text 3\Packages\Default\
Windows XP c:\Documents and Settings\Username\Application Data\Sublime Text 3\Packages\Default\
Windows (prijenosna instalacija) \installed_folder_Sublime_Text\Data\Packages\Default\
Aktivacija:
Pomoć - Unesite licencu - Umetnite ključeve iz distribucije - kliknite Koristi licencu
Citat:
-– POČETAK LICENCE –– Licenca za jednog korisnika Michaela Barnesa EA7E-821385 8A353C41 872A0D5C DF9B2950 AFF6F667 C458EA6D 8EA3C286 98D1D650 131A97AB AA919AEC EF20E143 B361B1E7 4C8B7 F0 4 B085E65E 2F5F5360 8489D422 FB8FC1AA 93F6323C FD7F7544 3F39C318 D95E6480 FCCC7561 8A4A1741 68FA4223 ADCEDE07 200C25BE DBBC4855 C4CFB774 C5EC1 38C 0FEC1CEF D9DCECEC D3A5DAD1 01316C36 - - KRAJ LICENCE --
Citat:
-– POČNI LICENCU –– Besplatne zajednice Consultoria em Informatica Ltda Licenca za jednog korisnika EA7E-801302 C154C122 4EFA4415 F1AAEBCC 315F3A7D 2580735A 7955AA57 850ABD88 72A1DDD8 8D2CE060 CF980C29 890D7 4F2 53131895 281E324E 98EA1FEF 7FF69A12 17CA7784 490862AF 833E133D FD22141D D8C89B94 4C10A4D2 24693D70 AE37C18F 72EF0BE5 1ED60704 651BC71 F 16CA1B77 496A0B19 463EDFF9 6BEB1861 CA5BAD96 89D0118E -- KRAJ LICENCE --
Citat:
-– POČETAK LICENCE –– Nicolas Hennion Licenca za jednog korisnika EA7E-866075 8A01AA83 1D668D24 4484AEBC 3B04512C 827B0DE5 69E9B07A A39ACCC0 F95F5410 729D5639 4C37CECB B2522FB3 8 D3 7FDC1 72899363 BBA441AC A5F47F08 6CD3B3FE CEFB3783 B2E1BA96 71AAF7B4 AFB61B1D 0CC513E7 52FF2333 9F726D2C CDE53B4A 810C0D4F E1F419A3 CDA0832B 8 440 565A 35BF00F6 4CA9F869 ED10E245 469C233E -- KRAJ LICENCE --
Citat:
-– POČETAK LICENCE –– Anthony Sansone Licenca za jednog korisnika EA7E-878563 28B9A648 42B99D8A F2E3E9E0 16DE076E E218B3DC F3606379 C33C1526 E8B58964 B2CB3F63 BDF901BE D31424D2 082 891B5 F7058694 55FA46D8 EFC11878 0868F093 B17CAFE7 63A78881 86B78E38 0F146238 BAE22DBB D4EC71A1 0EC2E701 C7F9C648 5CF29CA3 1CB14285 19A4699 1 E9A986 76 14FD4777 2D8A0AB6 A444EE0D CA009B54 -- KRAJ LICENCA --
Citat:
-– POČETAK LICENCE –– Alexey Plutalov Licenca za jednog korisnika EA7E-860776 3DC19CC1 134CDF23 504DC871 2DE5CE55 585DC8A6 253BB0D9 637C87A2 D8D0BA85 AAE574AD BA7D6DA9 2B9773F2 324C 5DEF 17830A4E FBCF9D1D 182406E9 F883EA87 E585BBA1 2538C270 E2E857C2 194283CA 7234FF9E D0392F93 1D16E021 F1914917 63909E12 203C0169 3F08FFC 8 8 6D06EA8 73DDAEF0 AC559F30 A6A67947 B60104C6 -- KRAJ LICENCA --
Citat:
-– POČETAK LICENCE –– Peter Halliday Licenca za jednog korisnika EA7E-855988 3997BFF0 2856413A 7A555954 67069B78 06D8CE12 63EAF079 AD039757 79E16D13 C555AD90 465CBE53 10F6DFC4 D3A 3C 611 411106F8 0CFEB15F 0A7BB891 111F5ED2 C6AA8429 77913528 FA6291A9 B88D4550 F1D6AB13 BF9153BC 91B4DFFE D296CFE0 C1D8EB22 13D5F14E 75A699EC 4 9EDDC23 D89D0F9B D240B10A A3712467 09DE7870 -- KRAJ LICENCA --
Citat:
-– POČETAK LICENCE –– Fred Zirdung Licenca za jednog korisnika EA7E-844672 6089C0EC 22936E1A 1EADEBE2 B8654BBA 5C98FFA6 C0FD1599 0364779B 071C74FB EEFE9EAB 92B3D867 CD1B32FE D19026 9F 6 FC08F8F 8D24191D 32828465 942CE58E AECE5307 08B62229 D788560A 6E0AAC4B 48A2D9EE 24FD8CAA 07BEBDF2 28EA86D4 CCB96084 6C34CAD2 E8A04F39 3 B5A3CBC 3B668BB7 C94D0B4B 847D6D7F 4BC07375 -- KRAJ LICENCA --
Citat:
-– POČETAK LICENCE –– Wixel licenca za jednog korisnika EA7E-848235 103D2969 8700C7ED 8173CF61 537000C0 EB3C7ECB 5E750F17 6B42B67C A190090B 7669164F C6F371A8 5A1D88D5 BDD0 DA70 C065892B 7CC1BB2B 1C8B8C7C F08E7789 7C2A5241 35F86328 4C8F70D9 C023D7C2 11245C36 59A730DB 72BDB9A7 D5B20304 90E90E72 9F08CA25 73F4 9C20 179D938E 5BC8BEDA 13457A69 39E6265F 233767F9 -- KRAJ LICENCA - -
Citat:
-– POČETAK LICENCE –– Daniel Russel Licenca za jednog korisnika EA7E-917420 9327EC62 44020C2A 45172A68 12FE13F1 1D22245B 680892EE F551F8EB C183D032 8B4EDB4B 479CB7E4 07E42EDD A78 002 1D 56BADF42 AC05238B 023B47B1 EBA1B7DE 6DF9A383 159F32AE 04EBE100 1278B1D2 52E81B60 C68AA2E8 F84A20BE FE7990EB 5D44E4B6 16369263 1DDAACBC 2 80FF1 9E 86CF4319 0B8615A8 4FF0512E B123B8EC -- KRAJ LICENCE --
Citat:
-– POČETAK LICENCE –– Peter Eriksson Licenca za jednog korisnika EA7E-890068 8E107C71 3100D6FC 2AC805BF 9E627C77 72E710D7 43392469 D06A2F5B F9304FBD F5AB4DB2 7A95F172 FE68E300 4 27 45819 E94AB2DF C1893094 ECABADC8 71FEE764 20224821 3EABF931 745AF882 87AD0A4B 33C6E377 0210D712 CD2B1178 82601542 C7FD8098 F45D2824 BC7DFB38 F1EBD 38A D7A3AFE0 96F938EA 2D90BD72 9E34CDF0 -- KRAJ LICENCE --
Citat:
-– POČETAK LICENCE –– Licenca za jednog korisnika Ryan Clark EA7E-812479 2158A7DE B690A7A3 8EC04710 006A5EEB 34E77CA3 9C82C81F 0DB6371B 79704E6F 93F36655 B031503A 03257CCC 01B20 F60 D304FA8D B1B4F0AF 8A76C7BA 0FA94D55 56D46BCE 5237A341 CD837F30 4D60772D 349B1179 A996F826 90CDB73C 24D41245 FD032C30 AD5E7241 4EAA6 6ED 16 7D91FB 55896B16 EA125C81 F550AF6B A6820916 -- KRAJ LICENCE --
Instaliranje kontrole paketa:
Package Control je upravitelj dodataka koji radi iz sučelja uređivača i omogućuje vam instaliranje dodataka u hodu, bez ponovnog pokretanja uređivača. Zahvaljujući "pametnom" neizrazitom pretraživanju, cijeli proces traje samo nekoliko sekundi.
Da biste instalirali kontrolu paketa, morate učiniti sljedeće:
Otvorite konzolu (Prikaz -> Prikaži konzolu ili Ctrl+`);
U pozivnici (tamo gdje pokazivač treperi) kopirajte i zalijepite sljedeće:
Kodirati:
import urllib.request,os,hashlib; h = "2915d1851351e5ee549c20394736b442" + "8bc59f460fa1548d1514676163dafc88"; pf = "Kontrola paketa.sublime-package"; ipp = sublime.installed_packages_path(); urllib.request.install_opener(urllib.request.build_opener(urllib.request.ProxyHandler())); by = urllib.request.urlopen("http://packagecontrol.io/" + pf.replace(" ", "%20")).read(); dh = hashlib.sha256(by).hexdigest(); print("Pogreška provjere preuzimanja (dobio %s umjesto %s), pokušajte ručno instalirati" % (dh, h)) if dh != h else open(os.path.join(ipp, pf), "wb" ).write(by)
Pritisni enter;
Čekamo malo. Čim vidimo poruku "plugins loaded" u konzoli, to znači da je kontrola paketa instalirana;
Da biste sakrili konzolu, odaberite Pogled -> Sakrij konzolu (putem Ctrl+` ili Esc);
Kako biste bili sigurni da je Package Control stvarno instaliran, idite na Preferences -> Package Control (ili preko Ctrl+Shift+P).
Prijenosne značajke:
Nije potrebna instalacija.
Liječenje je slično ugradnji.
