Tipps fir den Hintergrund Watermark op eng Websäit ze schafen

Gitt dës Technik mat CSS aus

Wann Dir eng Websäit entwéckelt, kënnt Dir wëllesst intresséiert sinn ze léieren wéi Dir e festen Hannergrond oder Waassermar op enger Websäit erstellen kënnt. Dëst ass eng gemeinsame Designbehandlung, déi zanter e puer Méint online geleiert gouf. Et ass e praktesche Effekt ze hunn an Ärem Webdesign Tub vun Tricks.

Wann Dir dat net virdrun gemaach hutt oder et virdru versicht ouni Gléck, de Prozess vläicht entimidéieren, awer et ass eigentlech net ganz schwéier schwéier. Mat dësem kuerzen Tutorial kënnt Dir d'Informatioun benotzen fir d'Technik an enger Saach vu Minutten ze benotzen wann Dir CSS benotzt.

Ufänken

Hannergréisst Biller oder Waassermarken (déi wierklech nëmme ganz helle Background Biller sinn) hunn eng Geschicht am gedréckten Design. Dokumenter hunn laang Waasser opgeholl fir hinnen ze verhënneren datt se kopéiert ginn. Zousätzlech benotze vill Flyer an Broschüren eng grouss Backgroundplaz als Deel vum Design fir de gedréckte Stéck. Webdesign huet laang Scholden ze léinen aus Print- a Backgroundbilder gehéieren ee vun dëse Scholden.

Dës gréissere Backgroundbilder si ganz einfach mat den folgenden dräi CSS-Stil- Propositiounen ze schaffen:

Background-Image

Dir benotzt Background-Image fir de Bild ze definéieren deen Dir als Wasserzeichen benotzt. Dëse Stil benotzt e Fichier Wee fir e Bild ze laden deen Dir op Ärer Säit hutt, wahrscheinlech an engem Verëffentleche mam Numm "Biller".

Hannergrond-Image: url (/images/page-background.jpg);

Et ass wichteg datt d'Bild selwer méi hell oder méi transparent ass wéi e normale Bild. Dëst erlaabt datt "Watermark" kuckt, wou e halleft transparente Bild hannert dem Text, der Grafik an aner Elementer vun der Websäit läit. Ouni dës Etappe konkret d'Hannergrondinformatioun mat der Informatioun op Ärer Säit a mécht et schwéier ze liesen.

Dir kënnt den Hannergrond an all Editiounsprogramm adaptéieren wéi Adobe Photoshop.

Background- Wiederhol

D'Background-Widderhuelung vum Besëtz ass nächst. Wann Dir wëllt datt Äert Bild eng grouss wäiss Grafikstil Grafik wëllt benotzen, musst Dir dës Eigenschaft benotzt fir dësst Bild nëmmen eemol ze gesinn.

Hannergrond -widderhuelen: nee -widderhuelen;

Ouni der "Nee-Widderhuelung" Eegeschafte sinn d'Standarden datt d'Bild erëm a Wierder erëm op der Säit zréckgesat gëtt. Dëst ass an der moderner Websäit Designs net wënschenswäert, sou datt dësen Stil als essentiell an Ärem CSS bezeechent gëtt.

Background-Attachment

Background-Attachement ass eng Eigenschaft déi vill Websäite vergiessen. Mat Benotzung hält Äre Backgroundfoto fixéiert wann Dir déi "fix" Eegeschafte benotzt. Et ass wat dat Bild bäi an e Wasserzeichen déi op der Säit fixéiert ass.

De Standardwert fir dës Eegeschafte ass "rullt". Wann Dir keng Background-Wäertbestëmmung spezifizelt, da wäerte d'Background mat dem Rescht vun der Säit aginn.

Background-Attachement: fixéiert;

Backgroundgréisst

Backgroundgréisst ass eng méi neier CSS-Eigenschaft. Et erméiglecht Iech d'Gréisst vun engem Hannergrond festzeleeën, baséierend op der Betracht, wou se agebonnen ass. Dëst ass ganz wichteg fir reagéiert Websäiten déi an verschiddenen Gréissten op verschiddene Geriwwele weisen .

Backgroundgréisst: Deckel;

Zwee Benotzer hëllefe fir dës Eigenschaft:

CSS op Är Säit ze addéieren

Nodeems Dir dës Eegeschafte versteet an hir Wäerter, kënnt Dir dës Stile op Är Websäit dobäisetzen.

Fült den HEID un der Websäit erop, wann Dir eng eenzeg Säite Site gemaach. Fügt et un d'CSS Stiwwelen vun engem externen Stylblat, wann Dir eng Multi-Page Site bauen an Dir wëllt profitéieren vun der Muecht vun engem externe Blatt.