Video Screencasts 2025, Januar

Hvala za ogled vseh, meni in tej strani pomeni vse. Ta objava v spletnem dnevniku je ogromen seznam virov za vse, kar smo zajeli v tej seriji "

Ko uporabljate vrstico, so vsi elementi v DOM-u, tako kot s in s ter kateri koli drugi element HTML. Če imate SVG všeč: in imate: var rect = "

V tem predvajanju zaslona se poglobimo v članek Léonie Watson o dostopnem SVG-ju in ga v bistvu pregledamo od točke do točke. Uživam, da je prva točka "

Veliko časa smo se pogovarjali o uporabi inline in elementa. Sistem ikon lahko sestavite s sistemom, ki je bogat s prednostmi. Ustvarite lahko

Z SVG lahko storite veliko brez kakršne koli programske opreme. Ob predpostavki, da imate dober vir slik SVG v spletu, jih lahko uporabite neposredno. Ampak "

JavaScript je zadnji od načinov, ki jih bomo obravnavali pri animiranju SVG. Ogledali smo si CSS, ki je odličen in zelo udoben, vendar ne more narediti številnih SVG "

Koncept rezanja in maskiranja je precej preprost. Skrij določene dele elementov in pokaži druge. Dejanska razlika med njima je precej preprosta "

Ste morda že slišali za filtre CSS? Uporabite jih lahko za kateri koli element iz CSS, na primer: .apply-css-filter (-webkit-filter: sivine (0,5); filter: "

Verjetno za to ni izredno velikega primera, razen očitnega: med večjim oblikovanjem SVG potrebujete rastrsko grafiko. "

Morda pride dan, ko si želite, da bi bila slika, ki ste jo imeli, SVG, vendar jo imate samo v rasterju, kot so GIF, JPG.webp ali PNG. V tem videu si ogledamo primer "

Priljubljena mala animacijska tehnika SVG je risanje poti. Če si tega ne morete predstavljati, je tukaj zbirka milijon primerov, ki sem jih ustvaril. V bistvu "

V SVG je element. Tukaj ni velikega presenečenja: namenjeno je vstavljanju besedila v SVG. Ne obrisi oblik črk (čeprav lahko tudi to storite), ampak "

To je malo ezoterično, enkrat sem to moral storiti sam in zmedlo me je, zato sem mislil, da bom o tem naredil cel video. Stvar je,"

Video je bil odstranjen na tej. Kmalu ga bom ponovno posnel. Če to berete in tega še nisem storil, se obrnite na mene in me prisluhnite "

Ta nasvet velja samo, če imate Adobe Illustrator CC (Creative Cloud). Potrdila sem, da deluje v tem ali še novejšem CC 2014. Preprosto je "

Čeprav bi bilo animiranje SVG s CSS morda bolj udobno za povprečnega uporabnika, ima SVG še en način, kako animacijo vgraditi naravnost v SVG. "

Ko uporabljate vstavljeni SVG, je vsa ta koda SVG v HTML-ju in s tem v DOM-u. Lahko jih oblikujete tako, kot bi, ali kateri koli drug HTML "

Izvedeli smo, da je omejitev uporabe SVG-ja v tem, da ne morete pisati sestavljenih izbirnikov CSS, ki vplivajo nanjo. Na primer:

Izraz "orodje za gradnjo" je lahko zastrašujoč. Spomni se modnih orodij ukazne vrstice, ki zahtevajo konfiguracijo in čudne sistemske odvisnosti, ki se zlomijo, ko "

Vrstni SVG je mogoče "oblikovati" v smislu, da že ima polnila in poteze in še kaj drugega, ko ga postavite na stran. To je super in popolnoma "

Spletna mesta za fotografije vedno lahko filtrirajo rezultate iskanja po »vektorju«. In ne pozabite, ne glede na to, katero obliko dobite, ko nekaj prenesete. "

Spoznali smo, da so orodja za gradnjo še posebej izjemna za naloge, kot je spreminjanje mape, polne SVG-jev, v blok SVG defs. Kot je vedno v "

Vsekakor lahko z našimi orodji za gradnjo postanemo nekoliko bolj nerdni. V času objave tega je plakat otrok orodij za gradnjo Grunt. Obstajajo tekmovalci, "

Ko dobimo tisto, čemur pravimo naš "defs block" SVG - tisti del SVG, ki določa vse stvari, ki jih želimo risati kasneje - kam ga bomo postavili? Torej "

Element je sklop celotne ideje o vgrajenem sistemu ikon SVG. Izvedeli smo, da je čist način to, da vse, kar nameravate narisati, postavite pozneje. "

Postavitev bloka SVG defs na vrh dokumenta zagotovo deluje. Ima tudi nekaj prednosti, na primer dejstvo, da ni treba oddati nobene zahteve HTTP, "

SVG ima zelo kul in močan element, imenovan. Koncept je precej preprost. Poišče še en kod SVG, na katerega se sklicuje ID, in ga klonira "

Pokrili smo "vstavljeni SVG" - ki sintakso SVG spušča naravnost v HTML. Isti vstavljeni SVG lahko uporabite tudi drugje, na primer v ali "

Ne pozabite, da v SVG lahko dobite vse vektorje. Programska oprema Adobe je pri tem odlična. V PDF-ju so lahko vektorske stvari - samo odprite PDF in "

The Noun Project je (zelo) fantastično mesto, kjer lahko dobite SVG. Preštejmo načine Dobesedno vse v SVG in dejansko pride tako. Oni so "