Nettressurser er nesten uendelige, men å finne dem av kvalitet er virkelig den vanskelige tingenSelv om du søker litt og har en god liste over nettsteder dedikert til design, blir ting lettere. I en tid da språk som HTML og CSS er på en flott tid, er det nesten noen få klikk unna å komme nær gratis ressurser av høy kvalitet.
Vi skal liste opp en serie med gratis kort i HTML og CSS som passer perfekt for alle typer blogg, virksomhet, e-handel og mye mer. En lang rekke samling slik at den kan innlemmes i noe av arbeidet du gjør for alle typer kunder. La oss gjøre det med denne listen som bruker codepen.io slik at du kan få koden i både HTML og CSS.
Bloggkort moro # 1
en flott designkort som sier nesten alt bildet som representerer det, kan du gå til codepen.io for å få den tilsvarende koden og installere den på nettstedet ditt.
Bare CSS-nyhetskort CSS
Dette kortet, med Stranger Things som bakgrunn, skiller seg ut for sin jevne animasjon som avslører innholdet. Det er ren CSS.
Blogginnlegg
En forhåndsvisning av nettet ved å bringe musepekeren over det. Den har CSS og HTML for enkel innlemmelse.
Bloggkort
En minimalistisk responsiv bloggkortdesign. Raske og jevne animasjoner høy kvalitet som ikke gir noen likegyldighet.
Responsive visittkort
Skiller seg ut for den lille animasjonen ved å sveve musepekeren over kortbildet.
Nok et bloggkort
Vises korttekst når du holder markøren i den samme.
Visittkort
en enkelt, men nåværende kort besøk med demo og kode i HTML og CSS.
3D visittkort
Dette kortet er verdt en 3D-animasjon med HTML og CSS. Laget av Elena Nazarova, er det perfekt for et fargeslående visittkort.
CSS visittkort
Et veldig slående visittkort i CSS det roterer i 3D for å gi plass til en serie URL-adresser som svarer på musepekeren i det øyeblikket vi legger den ned.
Kortnett
En serie velplasserte kort med et iøynefallende design. Det er overraskende for sin forenklede estetikk, men med et godt treff i HTML-, CSS- og SCSS-koden.
3D-kort blir avslørt
Denne serien av kortnett avsløre mer informasjon for øyeblikket at vi la musa på ikonet i grønt. Samtidig som vi forlater pekeren, beveger resten av rutenettet seg tilsvarende.
Responsivt materialdesignkort
Med google designspråk, vises denne serien av kort som er uthevet av menyikonet som åpner all informasjon fra skuespillerne som i eksempelet. Vakre og intuitive animasjoner med flott visuelt utseende.
Flexbox-kortrutenett
Kortprototype i samme høyde som de skiller seg ut for å bruke nettet flexbox format. En annen av verdiene er bruken av CSS-sideforhold og CSS-filtre.
Clash of Clans Cards
El populært mobilspill har kortene sine i HTML og CSS laget av Andre Madarang. Vi kan passere mellom dem med en presis og svært visuell animasjon.
Skyvkort for e-handel
Med en smidig animasjonDisse kortene oppfordrer deg til å søke etter elementene deres for å finne ut hva de handler om. Med flott design fra Omar Dsoky.
Grensesnittdesign - Produktkort
Et perfekt kort å designe de av produkt av vår e-handel. Laget i HTML og CSS.
Produktkort
Fra det samme kortet vi kan gå gjennom flere bilder for bedre å se produktet. Den inkluderer knappen Legg til i handlekurv og inneholder HTML, CSS og JavaScript-kode.
Fleksible produktkort
Som navnet antyder, bruker flexbox for å lage en interessant animasjon når vi klikker på knappen Legg til i handlekurv.
Vend kort
Lite kode for noen kort med glatt og perfekt animasjon. I løpet av få minutter kan du innlemme dem. Nylig lagt til codepen.
Kort som 3D-produktkort
Det bør bemerkes at disse kortene er som om vi hadde en kortrekke på et bord. Pekeren er igjen og de zoomer inn, klikker på hver og viser baksiden av kortet for å vise produktinformasjonen. Vi klikker igjen og lar det være som det var med fronten. Perfekt for å lære 3D CSS-egenskaper.
Parallax-kort
Et veldig visuelt eksperiment med en iøynefallende flip-effekt. Det er bedre at du ser det for å vite hva det snakker om.
Sveveeffekt for kort
En enkel effekt men gimmicky svever om kort.
Enkel sveveeffekt
Slående ganske enkel effekt, men det har stor effekt i det øyeblikket vi visualiserer det.
Parallax dybdekort
Disse kortene bærer parallakskonsept til toppen å danne noen veldig slående kort etter design. Du må bare se det for å bedre forstå effekten det gir på brukeren når du velger noen av kategoriene i bloggen vår.
UI-kort for filmer
Et kort med flott layout laget med HTML og CSS.
Profilkort
veldig gode animasjoner for et kontaktkort der vi kan implementere tilgang til sosiale medieprofiler. HTML og CSS.
Polaroid-kort
Med egenskaper, filtre og CSS tilpassede overganger Denne serien av grupperte Polaroid-kort er opprettet; ikke gå glipp av disse SVG-bildene på nettet.
Det vil være mulig å sette inn noen av disse kortene på en side med wordpress
JEG ELSKER DEM