Vegyen fel színes vagy háttérképet a CSS webhelyére

2013. december 7

Testreszabhatja webhelyének hátterét az alábbi módok egyikével:

vagy

  1. Alkalmazzon egyenletes vagy színátmenetes színhatást a webhely hátterére
  2. Adjon hozzá háttérképet egy weboldalhoz
  3. Adjon hozzá egy színt, színátmenetet, képet vagy szegélyt egy területhez

A szín CSS-kódja: body

Az első háttérszín meghatározásával, a második pedig egy kép betöltésével az oldal hátterére. Kép feltöltése az oldal aljára nem tévesztheti meg. Hatalmas kép feltöltésével semmit nem lehet elérni, bármilyen nagy is lehet, nem lehet biztos abban, hogy a látogatónak nincs-e ennél nagyobb átlója, ezért a monitor mérete jóval meghaladja a kép méretét. Alapvetően a háttérkép egy kis kép, amelyet a böngésző tudni fog megismételni.

CSS-kód háttérkép hozzáadásához: body

  • háttér: Beállítja az utasítás összes háttértulajdonságát
  • háttérszín: Beállítja a CSS elem háttérszínét
  • background-image Beállítja a CSS elem háttérképét
  • background-position Beállítja a háttérkép kiinduló helyzetét
  • háttér-ismétlés Beállítja a háttérkép ismétlésének módját

1. Háttér négyzet alakú képekből.

Pontosan itt jelentkezik az első probléma. Hogyan fogja a böngésző megismételni őket? Feltételezzük, hogy létezik egy négyzet alakú kép, amelynek oldala 2 cm. A négyzeten belüli rajzot úgy kell végrehajtani, hogy két négyzet függőleges és vízszintes összekapcsolásakor a képek tökéletesen kombinálódjanak, és ne a szomszédos darabok benyomását keltsék, hanem az egészet.

2. Háttér szalagképekből
A második probléma a téglalapként definiált háttérképekkel merül fel, amelyekkel az oldal szélességének teljes lefedettségét szeretné, csak függőlegesen ismételve. Ezeknek a háttérszalagoknak a problémáit nemcsak nehezebb elkerülni, hanem még gyakoribbak. Milyen széles legyen a szalag? Mekkora a látogató böngészőablaka. Ha a böngésző ablaka szélesebb, mint a háttérsáv, akkor nem csak függőlegesen, hanem vízszintesen is megismétlődik, ami befejezetlen dolog benyomását kelti, feleslegesen kiterjesztve a jobb oldalon.

3. Előtér háttér korreláció.
Egy másik probléma, és ez nagyon gyakori, az összefüggés a háttér és a felette megjelenítendő szöveg és grafika jellemzői között. A túlterhelt háttér megnehezíti a szöveg elolvasását, egy bizonyos színű betűtípus lehetetlenné teszi bizonyos színekkel rendelkező szöveg elolvasását.

4. Az összefüggés az oldal háttere és üzenete között
Annak a ténynek köszönhetően, hogy bizonyos hátterek önmagukban képet képviselnek, egy bizonyos anyagot vagy ötletet sugall, A háttér és az oldal ötletének nincs összefüggése - szorosan összefüggésben kell lenniük az oldal ötlettel, gyakran még bosszantó is.

2WebDesign

Több mint egy évtizedes webdesign-tapasztalattal és az online iránti határtalan szenvedélytől vezérelve meghívjuk Önt, hogy látogassa meg oldalunkat és inspirálódjon a szakterület legérdekesebb cikkeinek elolvasása során.