Kere taustpildid on hõlpsasti tehtud

html

Mõnus funktsioon, mille leiate paljudelt saitidelt, on see, et keskne sisupiirkond paistab lehte kattuva varjutusega. See on tegelikult üsna lihtne meetod, kuidas oma ajaveeb ühe taustpildiga kena (või muu veebisaidi) väljanägemiseks muuta.

Kuidas seda tehakse?

  1. Mõelge välja, kui lai on teie sisu. Näide: 750 pikslit.
  2. Ehitage oma illustratsioonirakenduses (kasutan Illustratorit) pilt laiem kui sisupiirkond. Näide: 800 pikslit.
  3. Määrake pildi taustaks taust, mida soovite mõlemal pool blogi kasutada.
  4. Lisage taustale valge piirkond.
  5. Kandke valgele piirkonnale vari, mis ekstrudeerub piirkonna mõlemalt küljelt.
  6. Määrake kärpimisala laiuseks 1 piksli võrra. See muudab pildi kiireks renderdamiseks kena ja kompaktse allalaadimiseks.
  7. Väljundage pilt.

Siit saate teada, kuidas ma selle Illustratori abil ehitasin (pange tähele, et mul on viljapind palju pikem ... see on lihtsalt selleks, et näeksite, mida ma teen):
Taust Illustratoriga

Siin on näide selle kohta, kuidas väljund taustpildiga välja näeks:
Näide taustpildist

Siit saate teada, kuidas pilti rakendada, kasutades oma kehstiili silti CSS faili.

taust: # B2B2B2 URL ('images / bg.gif') kordus-y keskus;

Siin on lahatud tauststiili silt:

  • # B2B2B2 - määrab lehe üldise taustavärvi. Selles näites on hall, mis sobib taustpildil oleva halliga.
  • url ('images / bg.gif') - määrab taustpildi, mida soovite kasutada.
  • kordus-y - määrab pildi y-teljel korduma. Nii et taustpilt kordub lehe ülevalt alla.
  • keskel - määrab pildi lehe keskele.

Tore ja lihtne ... üks pilt, üks stiilimärgend!

2 Kommentaarid

  1. 1
  2. 2

Mis sa arvad?

Sellel saidil kasutatakse rämpsposti vähendamiseks Akismetit. Vaadake, kuidas teie andmeid töödeldakse.