14: SVG piktogramų sistema - defektų kūrimas CSS-gudrybės

Anonim

Šis elementas yra visa šios SVG piktogramų sistemos idėjos sąsaja. Sužinojome, kad švarus būdas tai padaryti yra sudėti viską, ką ketinate nupiešti vėliau, į bloką, kad tai nepateiktų, ir mes galime vėliau juos nurodyti (nurodykite naršyklei nupiešti tą piktogramą).

Šiame vaizdo įraše mes praleisime šiek tiek laiko patys kurdami savo bloką. Tai nėra ypač sunku ir, manau, varo namo, kaip visa tai veikia.

Pagaminsime iš SVG, kurį rasime skirtingose ​​žiniatinklio vietose. Mes paimame vieną iš „The Noun Project“, vieną iš „IcoMoon“ ir vieną iš „Shutterstock“. Mes atidžiai stebime atidarydami SVG, sutvarkydami bet kokias keistas formas, pritempdami drobės dydį ir dar ką. Čia nėra ribų, iš kur gali atsirasti ši vektorinė informacija. Šie trys šaltiniai yra tik parodyti, kad SVG gali būti iš bet kurios vektoriaus.

Vėliau, tikimės, supaprastinsime šį procesą, tačiau suprasti veržles ir varžtus, kaip tai veikia, visada naudinga. Niekada negali žinoti, kada reikės įsigilinti (pvz., Išsiaiškinti, kodėl kažkas neveikia gerai).