29 hoë gehalte CSS onder- en koptekste vir u bladsy weeb | Kreatiewe aanlyn
Die kop- en voetskrif is Noodsaaklike elemente by die skep van 'n nuwe bladsy web of 'n blog, of indien niks anders nie, moet ons dit opdateer om aan die huidige standaarde van webontwerp te voldoen. Dit is ruimtes waaraan die besoeker op ons webwerf gewoonlik baie aandag skenk, daarom moet ons na hulle omsien en hulle genoeg vertroetel sodat dit vir die oog aangenaam is, buiten dat dit funksioneel is.
Om hierdie rede gaan ons deel 29 CSS-kop- en voettekste wat u op u blog of webwerf kan gebruik, en gee dit sodoende die punt van kwaliteit waarna u gesoek het. Hierdie lys bestaan ​​uit volskerm-artikelkopskrifte, sowel as die standaardgrootte, vaste of vaste koptekste, voetskriftekens en sommige video-opskrifte om 'n ander perspektief op u webwerf te gee.
1 Geboë kop
2 Kopopskrif Parallaks
3 Hoekige vaste kop
4 Skewe kop
5 Kop met SVG-animasie
6 Vaste kop met Div
7 Parallakse meerlaagse illustrasie
8 Vaste poskopkop
9 Volskermkopkop met animasie
10 Heldbeeld volskerm
11 Flexbox met knoppie
13 Sticky Header op blaai
14 Responsiewe blaai taai
15 Blaai kop
16 Responsiewe rolopskrif
17 Kopstuk In / uit
18 Kopskrif vervaag
19 Kop wat versteek is
20 Parallaks voetskrif
21 Voetskrif met inhoudskaal
22 Voetskrif vir sosiale media
23 Geanimeerde mobiele voetskrifmenu
24 Eenvoudige vaste voetskrif
25 Reageer videoopskrif
27 Volledige skerm video-opskrif met mengmengsel
28 Video Header animasie
29 Responsiewe video-opskrif met gradiënt
'N Kop wat geïdentifiseer word deur sy geboë styl aan die onderkant wat dit 'n baie spesiale kop vir 'n webwerf of blog maak. Dit is suiwer CSS, en dit neem dus al tyd om op u web te toets hoe dit sal lyk as u dit by u blog insluit.
Met 'n uitstekende Parallax-beeldeffek, identifiseer hierdie kopstuk homself deur gebruik CSS agtergrond-beeld posisie. Die kopbeeld sal aan die bokant van die bladsy geplaas word vir 'n goeie effek-kode.
Hoekige vaste kop
Hierdie kop is goed aan die bokant van die webblad vasgestel op onderskei met daardie skuins lyn wat die hele horisontaal van die gebruiker se aansig oorsteek. Dit wys hoe CSS-pseudo-elemente gebruik kan word om 'n vaste kop met 'n agtergrondafbeelding te skep.
CSS en HTML vir hierdie opskrif wat in die gegewe voorbeeld gekenmerk word langs daardie skuins lyn wat die hele skerm deurkruis van die een kant na die ander.
Kop met SVG-animasie
'N Baie eenvoudige kop, alhoewel dit gebruik word 'n SVG-animasie om jouself te onderskei waarvan ons in hierdie lys is. U het toegang tot 'n groot lys webbladsye met SVG-animasies van hier af.
Vaste kop met Div
Met Parallax beeldeffek, 'n vaste kop wat uitstaan ​​vir die groot effek bereik met die vaste agtergrondbeeld terwyl die res blaai terwyl ons met die muis blaai.
Parallakse meerlaagse illustrasie
Volskermkopkop met animasie
'N Kop wat 'n animasie bied wat beweeg lateraal en dit veroorsaak 'n ontspannende effek op die kyker.
met 'n zoom-effekDit kop volskerm dit word geopenbaar as een van groot oorspronklikheid. Ideaal vir 'n webwerf waarop die besoeker baie gebruik sal maak om te blaai.
Flexbox met knoppie
'N Kop wat die hele breedte van die skerm neem om 'n knoppie te vertoon. Ideaal vir bestemmingsbladsye met CSS flexbox.
'N Kop met effek parallaks en flexbox redelik eenvoudig wat veral uitstaan ​​vir die elegansie van die ontwerp.
Sticky Header op blaai
Soos sy naam aandui, 'n vaste kop wanneer ons blaai met die muis as ons beweeg om die res van die webblad te sien.
Responsiewe blaai taai
Nog 'n vaste opskrif met groot effek wanneer die spyskaart bo-aan die bladsy kom, waaromen op daardie oomblik bly dit vas en ons kan die bladsy bly blaai.
Dit verskil van die res deur behoorlike en fyn animasie soos ons beweeg. Aan die einde daarvan bly die hoofstuk aan die bokant vas.
Kopstuk In / uit
'N Kop wat deur die effek onderskei word In / uit na blaai en dit lewer die sensasie van rebound.
Kop wat versteek is
'N Ander kopkop as daar volgens ons gebruik blaai met 'n animasie dit bly ongemerk maar van groot gehalte.
Voetskrif met inhoudskaal
'N hoë gehalte en oorspronklike voetskrif vir verstom die besoeker vir die sierlike manier om hierdie webruimte te vertoon.
Voetskrif vir sosiale media
N voetskrif wat uitstaan ​​vir die knoppies wat lei tot sosiale netwerke bekendste. Die animasie wat plaasvind wanneer u die muiswyser oor elkeen van die sosiale netwerke laat, val op.
Geanimeerde mobiele voetskrifmenu
Deur die venster van die webblaaier te verminder om hierdie voetskrif te sien, kan u dit doen vind die 2-3 afdelings wat die gebruiker op 'n mobiele toestel kan vind. Dit word 767px vertoon.
Eenvoudige vaste voetskrif
Gemaak in HTML en CSS is 'n eenvoudige voetskrif sonder veel fanfare en floreer.
N kop met eenvoudige video React.js.
Ander kop met 'n eenvoudige video en van groot gehalte.
Volledige skerm video-opskrif met mengmengsel
Toon a volledige skerm video met teks op laag met behulp van mengmengsel-modus
Video Header animasie
Die animasie was aangepas met Adobe After Effects om versoenbaar te wees met alle blaaiers. Dit werk nie op mobiele toestelle nie.
Responsiewe video-opskrif met gradiënt
El gradiënt is wat uitstaan na die video-opskrif van die res.
Volledige pad na artikel: Aanlyn kreatiewe » tegnologie » CSS » 29 CSS-kop- en voettekste vir u blog of webwerf