Päised ja jalused on Olulised elemendid uue lehe loomisel veebi või ajaveebi või kui pole midagi muud, peame neid värskendama, et need vastaksid praegustele veebidisaini standarditele. Need on ruumid, millele meie veebisaidi külastaja tavaliselt suurt tähelepanu pöörab, seega peame nende eest hoolitsema ja neid piisavalt hellitama, et need oleksid silmale meeldivad, lisaks funktsionaalsusele.
Sel põhjusel hakkame jagama 29 CSS-i päist ja jalust, mida saate kasutada oma ajaveebis või veebisaidilja seeläbi andke talle see kvaliteedipunkt, mida otsisite. See loend koosneb täisekraanil olevate artiklite päistest, samuti standardsuurusest, fikseeritud või fikseeritud päistest, jalustest ja mõnest video päisest, et anda teie veebisaidile veel üks perspektiiv.
Kumer päis
Päis, mille tähistab selle kõver stiil allosas mis muudab selle veebisaidi või ajaveebi jaoks väga eriliseks päiseks. See on puhas CSS, nii et juba on vaja oma veebilavastuste testimist aega võtta, kuna see näeb välja, kui lisate selle oma ajaveebi.
Päise pilt Parallaks
Suure parallaksi pildiefektiga identifitseerib see päis ennast kasutage CSS-i taustpildi positsiooni. Hea efekti koodi jaoks oleks päise pilt paigutatud lehe ülaossa.
Nurga all fikseeritud päis
See päis on veebilehe ülaosas hästi fikseeritud eristuda selle diagonaaljoonega mis ületab kogu kasutaja vaate horisontaali. See näitab, kuidas CSS-i pseudoelemente saab kasutada fikseeritud taustpildiga päise loomiseks.
Viltune päis
CSS ja HTML selle päise jaoks, mida antud näites iseloomustatakse mööda seda diagonaaljoont mis läbib kogu ekraani ühelt küljelt teisele.
Päis SVG-animatsiooniga
Väga lihtne päis, kuigi seda kasutatakse enda eristamiseks SVG-animatsioon millest meil on selles loendis. Juurdepääs on suurel hulgal veebilehtedel siit SVG-animatsioonidega.
Fikseeritud päis jaotusega Div
Parallaksi pildiefektiga fikseeritud päis, mis paistab silma suurepärase efekti poolest saavutatud fikseeritud taustpildiga, samal ajal kui ülejäänud osa kerib, kui me hiirega kerime.
Parallaksi mitmekihiline illustratsioon
Aastal hea viimistlusega päis Mitmekihiline HTML, CSS ja JavaScript ja seda saab suurepäraselt kasutada videomängude maailmaga seotud veebisaidi jaoks. Suurepärane viimistlus kogu aeg.
Fikseeritud postipäis
Fikseeritud päis iga HTML-i, CSS-i ja JavaScripti tehtud postituse jaoks. Hetkel, kui me alla veereme, päis on minimeeritud ja fikseeritud ülaosas.
Animatsiooniga täisekraani päis
Päis, mis pakub animatsiooni liigub külgsuunas ja see annab vaatajale lõõgastava efekti.
Täisekraanil kangelase pilt
koos suumi efekton päis täisekraanil see ilmneb suure originaalsusena. Ideaalne veebisaidi jaoks, kus külastaja kasutab kerimiseks kerget liikumist.
Flexbox nööbiga
Päis, mis võtab nupu kuvamiseks kogu ekraani laiuse. Ideaalne sihtlehtede jaoks CSS-i flexboxiga.
Flexboxi kangelase päis
Efektiga päis parallaks ja flexbox üsna lihtsad mis paistab silma peamiselt oma disaini elegantsi poolest.
Kleepuv päis kerimisel
Nagu nimigi ütleb, fikseeritud päis millal kerime liikudes hiirega ülejäänud veebisaidi nägemiseks.
Tundlik kerimine kleepuv
Veel üks fikseeritud hea efektiga päis, kui menüü jõuab lehe ülaossa, miksja sel hetkel jääb see fikseerituks ja saame jätkata saidi kerimist.
Kerige päist
See erineb teistest selle poolest korralik ja peen animatsioon kui me liigume. Selle lõpus jääb voodipealne fikseeritud.
Reageeriv kerimispäis
Veel üks suurepärane animatsioon eristage seda päist muust HTML-i, CSS-i ja JavaScripti abil.
Päise sisse / välja
Päis, mida eristab efekt Pärast kerimist sisse / välja ja see tekitab tagasilöögi tunde.
Päis tuhmub
Teine animatsiooniefekt uudishimulik ja väga elegantne HTML-is, CSS-is ja JavaScriptis.
Peidetud päis
Vastavalt peitmisel teistsugune päis kasutame kerimist animatsiooniga see jääb märkamatuks, kuid suurepärase kvaliteediga.
Parallaksi jalus
HTML-i, CSS-i ja JavaScripti abil fikseeritud või fikseeritud jalus. of suurepärane kvaliteet varjundiga tegelikult.
Sisuskaalaga jalus
Kvaliteetne ja originaalne jalus hämmastavad külastajat selle veebiruumi graatsilise kuvamisviisi jaoks.
Sotsiaalmeedia jalus
Jalus, mis paistab silma nupud, mis viivad suhtlusvõrgustikesse kõige tuntum. Silma jääb animatsioon, mis tekib siis, kui jätate hiirekursori iga suhtlusvõrgustiku kohale.
Animeeritud mobiilse jalusega menüü
Selle jaluse nägemiseks vähendate veebibrauseri akent, saate seda teha leidke 2-3 jaotist mille kasutaja saab mobiilseadmest leida. Seda kuvatakse 767 pikslit.
Lihtne fikseeritud jalus
Made in HTML ja CSS on a lihtne jalus ilma suurema kärata ja õitsema.
Reageeri video päis
Päis koos lihtne video React.js.
Video päis
Muu päis lihtsa videoga ja suurepärase kvaliteediga.
Mix-Blendiga täisekraaniga video päis
Kuva a täisekraani video tekst kihil, kasutades mix-blend režiimi.
Video päise animatsioon
Animatsioon oli kohandatud Adobe After Effectsiga kõigi brauseritega ühilduvaks. See ei toimi mobiilseadmes.
Reageeriv video päis koos gradientiga
El gradient on see, mis silma paistab sellele ülejäänud video päisele.
Nad kõik veensid mind. Aitäh
Tere tulemast!