Anteturile și subsolurile sunt Elemente esențiale la crearea unei pagini noi web sau un blog sau, dacă nu altceva, trebuie să le actualizăm pentru a respecta standardele actuale de design web. Sunt spații în care vizitatorul site-ului nostru acordă de obicei o atenție deosebită, așa că trebuie să avem grijă de ele și să le răsfățăm suficient, astfel încât să fie plăcute pentru ochi, în afară de a fi funcționale.
De aceea vom împărtăși 29 anteturi și subsoluri CSS pe care le puteți folosi pe blogul sau site-ul dvs. web, și, astfel, acordați-i acel punct de calitate pe care îl căutați. Această listă este alcătuită din anteturile articolelor pe ecran complet, precum și dimensiunea standard, anteturile fixe sau fixe, subsolurile și unele anteturi video pentru a oferi un alt punct de perspectivă site-ului dvs.
Antet curbat
Un antet care este identificat prin stilul său curbat în partea de jos ceea ce îl face un antet foarte special pentru un site sau blog. Este CSS pur, așa că este deja nevoie de timp pentru a testa în stadiul web cum va arăta dacă îl includeți pe blogul dvs.
Imagine antet Parallax
Cu un efect excelent de imagine Parallax, acest antet se identifică prin utilizați poziția imaginii de fundal CSS. Imaginea antetului va fi poziționată în partea de sus a paginii pentru un cod de efect excelent.
Antet fixat unghiular
Acest antet este bine fixat în partea de sus a paginii web la diferențiați cu acea linie diagonală care traversează întreaga orizontală a vizualizării utilizatorului. Arată modul în care pseudo-elementele CSS pot fi utilizate pentru a crea un antet fix cu o imagine de fundal.
Antet înclinat
CSS și HTML pentru acest antet care în exemplul dat este caracterizat de-a lungul acelei linii diagonale care traversează întregul ecran dintr-o parte în alta.
Antet cu animație SVG
Un antet foarte simplu, deși îl folosește o animație SVG pentru a te distinge dintre cele pe care le avem pe această listă. Puteți accesa o listă mare de pagini web cu animații SVG de aici.
Antet fix cu Div
Cu efect de imagine Parallax, un antet fix care se remarcă prin efectul excelent realizat cu imaginea de fundal fixă în timp ce restul derulează pe măsură ce derulăm cu mouse-ul.
Ilustrație multi-strat Parallax
Un antet de mare finalizare în HTML, CSS și JavaScript cu mai multe straturi și care poate fi folosit perfect pentru un site web legat de lumea jocurilor video. Final excelent pe tot parcursul.
Antet post fix
Un antet fix pentru fiecare postare realizată în HTML, CSS și JavaScript. În momentul în care ne rostogolim, antetul este minimizat și fixat în partea de sus.
Antet pe ecran complet cu animație
Un antet care oferă o animație care se deplasează lateral și asta produce un efect relaxant asupra privitorului.
Imagine erou pe ecran complet
cu un efect de zoomAcest antetul ecran complet este revelat ca unul de mare originalitate. Perfect pentru un site web în care vizitatorul va face o mare utilizare a derulării pentru a derula prin acesta.
Flexbox cu buton
Un antet care necesită întreaga lățime a ecranului pentru a afișa un buton. Perfect pentru pagini de destinație cu CSS flexbox.
Antetul Flexbox Hero
Un antet cu efect paralax și flexbox destul de simplu care se remarcă prin eleganța designului său în principal.
Antet lipicios pe scroll
După cum sugerează și numele, un antet fix când derulăm cu mouse-ul la mișcare pentru a vedea restul paginii web.
Defilare receptivă Sticky
Un alt antet fix de mare efect atunci când meniul ajunge în partea de sus a paginii, de ceiar în acel moment rămâne fix și putem continua să derulăm site-ul.
Derulați antetul
Se diferențiază de restul prin animație corectă și delicată pe măsură ce ne mișcăm. La sfârșitul acestuia, tăblia rămâne fixă în partea de sus.
Antet de derulare sensibilă
O altă animație excelentă pentru distingeți acest antet de restul cu HTML, CSS și JavaScript.
Header In / Out
Un antet care se distinge prin efect In / out după derulare și asta produce senzația de revenire.
Antetul se estompează
Un alt efect de animație curios și foarte elegant în HTML, CSS și JavaScript.
Antet ascuns
Un antet diferit atunci când se ascunde conform folosim defilarea cu o animație care trece neobservat, dar de mare calitate.
Subsol Parallax
Un subsol fix sau fix cu HTML, CSS și JavaScript. De calitate excelentă cu umbrire in efect.
Subsol cu scară de conținut
Un subsol original și de înaltă calitate pentru uimi vizitatorul pentru modul grațios de a afișa acest spațiu web.
Subsol pentru rețelele sociale
Un subsol care iese în evidență butoanele care duc la rețelele de socializare cel mai cunoscut. Se remarcă animația produsă la lăsarea indicatorului mouse-ului peste fiecare dintre rețelele sociale.
Meniu subsol mobil animat
Reducând fereastra browserului web pentru a vedea acest subsol, puteți găsiți cele 2-3 secțiuni pe care utilizatorul o poate găsi pe un dispozitiv mobil. Este afișat la 767 px.
Subsol simplu fix
Realizat în HTML și CSS este un subsol simplu, fără prea multă fanfară și înflorire.
Reactionați antetul video
Un antet cu videoclip simplu React.js.
Antet video
Alte antet cu videoclip simplu și de mare calitate.
Antet video pe ecran complet cu Mix-Blend
Arată un video pe ecran complet cu text pe strat folosind modul mix-blend.
Animație antet video
Animația a fost personalizat cu Adobe After Effects pentru a fi compatibil cu toate browserele. Nu funcționează pe mobil.
Antet video receptiv cu gradient
El gradientul este ceea ce iese în evidență la acest antet video din rest.
Toți m-au convins. Mulțumiri
Cu plăcere!