Taustan lisääminen verkkosivustoon: 14 vaihetta (kuvilla)

Sisällysluettelo:

Taustan lisääminen verkkosivustoon: 14 vaihetta (kuvilla)
Taustan lisääminen verkkosivustoon: 14 vaihetta (kuvilla)

Video: Taustan lisääminen verkkosivustoon: 14 vaihetta (kuvilla)

Video: Taustan lisääminen verkkosivustoon: 14 vaihetta (kuvilla)
Video: Nerokkaat Niksit Elämään, Jotka Toimivat Erittäin Hyvin ▶3 2024, Saattaa
Anonim

Tausta on yksi verkkosivuston tärkeimmistä osista. Hyvä tausta luo verkkosivuston sävyn ja täydentää sisältöä. Taustan lisäämiseen on monia eri tapoja, joilla kaikilla on eri tarkoitus. Joidenkin menetelmien avulla voit soveltaa taustaa kaikille verkkosivuston sivuille, kun taas toiset rajoittavat taustan vain tietylle sivulle. Tämä artikkeli opettaa sinulle, miten voit lisätä taustaasi verkkosivustollesi HTML- tai CSS -tiedoston avulla.

Askeleet

Menetelmä 1/2: HTML -menetelmät

Yksivärinen tausta

Taustan lisääminen verkkosivustoon Vaihe 1
Taustan lisääminen verkkosivustoon Vaihe 1

Vaihe 1. Yhtenäinen tausta on yksinkertaisin tausta, jonka voit laittaa verkkosivustolle

Itse asiassa jokainen sivusto alkaa oletus valkoisella taustalla. Vaikka valkoinen tausta voi olla hyvin tyylikäs ja puhdas, kun sitä käytetään harmonisessa värimaailmassa, eriväristä taustaa voidaan suosia eri teemoilla.

Taustan lisääminen verkkosivustoon Vaihe 2
Taustan lisääminen verkkosivustoon Vaihe 2

Vaihe 2. Avaa verkkokoodisi (lähde)

Taustan lisääminen verkkosivustoon Vaihe 3
Taustan lisääminen verkkosivustoon Vaihe 3

Vaihe 3. Lisää body -tunnisteeseen attribuutti nimeltä bgcolor

Nyt kehon tunnisteen pitäisi näyttää tältä-

jossa COLORNAME on värin nimi. COLORNAME voidaan täyttää monenlaisilla värin edustajilla-

  • (värin nimi)
  • (heksadesimaaliarvo)
  • (RGB -arvo)
Taustan lisääminen verkkosivustoon Vaihe 4
Taustan lisääminen verkkosivustoon Vaihe 4

Vaihe 4. RGB: llä ja #: llä kokeileminen voi johtaa moniin sävyihin, mutta voit valita helpomman ensimmäisen tavan

Muista kuitenkin, että harvinaisen värin kirjoittaminen "Ultramarine Bluish Green" johtaa valkoiseen.

Taustakuvan lisääminen

Taustakuvan lisääminen on hieman monimutkaisempaa kuin yksivärinen tausta

Taustan lisääminen verkkosivustoon Vaihe 5
Taustan lisääminen verkkosivustoon Vaihe 5

Vaihe 1. Lisää taustaominaisuus body-tunnisteeseen, joten se näyttää tältä:

jossa SRC on kuvan lähde SRC voi olla samassa kansiossa tai toisessa kansiossa/verkkosivulla.

  • (samassa kansiossa)
  • (eri kansion sisällä)
  • (eri verkkosivulla)
Taustan lisääminen verkkosivustoon Vaihe 6
Taustan lisääminen verkkosivustoon Vaihe 6

Vaihe 2. Muista kirjoittaa.gif /-j.webp" />

Menetelmä 2/2: CSS -menetelmät

Taustan lisääminen verkkosivustoon Vaihe 6
Taustan lisääminen verkkosivustoon Vaihe 6

Yksivärinen tausta

Taustan lisääminen verkkosivustoon Vaihe 7
Taustan lisääminen verkkosivustoon Vaihe 7

Vaihe 1. Jos haluat lisätä yksivärisen taustan CSS: ään, lisää tyylimäärite

Voit myös antaa tunnuksia ja luokkia sekä käyttää ulkoisia ja sisäisiä tyylitaulukoita.

Taustan lisääminen verkkosivustoon Vaihe 8
Taustan lisääminen verkkosivustoon Vaihe 8

Vaihe 2. Kehotunnisteen pitäisi näyttää tältä:

jossa VÄRINIMI on värin, heksadesimaalin tai RGB: n nimi (Muista myös HTML: n yksivärisen taustan viimeiset vaiheet, ne soveltuvat myös tähän).

Kuvan lisääminen

Taustan lisääminen verkkosivustoon Vaihe 9
Taustan lisääminen verkkosivustoon Vaihe 9

Vaihe 1. Voit lisätä kuvan lisäämällä style -määritteen body -tunnisteeseen

Voit myös antaa tunnuksia ja luokkia sekä käyttää ulkoisia ja sisäisiä tyylitaulukoita.

Taustan lisääminen verkkosivustoon Vaihe 10
Taustan lisääminen verkkosivustoon Vaihe 10

Vaihe 2. Kehotunnisteen pitäisi nyt näyttää tältä:

Taustan lisääminen verkkosivustoon Vaihe 11
Taustan lisääminen verkkosivustoon Vaihe 11

Vaihe 3. Muista, että SRC on lähde

Se voi olla samasta kansiosta, eri kansiosta tai eri verkkosivulta.

  • (samassa kansiossa)
  • (eri kansion sisällä)
  • (eri verkkosivulla).
Taustan lisääminen verkkosivustoon Vaihe 12
Taustan lisääminen verkkosivustoon Vaihe 12

Vaihe 4. Muista lisätä myös.laajennukset

Toistuva kuvioitu tausta

Taustan lisääminen verkkosivustoon Vaihe 13
Taustan lisääminen verkkosivustoon Vaihe 13

Vaihe 1. Jos haluat luoda toistuvan kuvion taustan, lisää tausta yllä olevien vaiheiden mukaisesti

Body tagisi on nyt vaihdettava muotoon-

Missä REPEAT-SETTINGS ovat asetukset. Toistovaihtoehtoja voi olla monia, esim.

  • (Tausta toistuu sekä pysty- että vaakasuunnassa.)
  • (Tausta toistuu vaakasuunnassa.)
  • (Tausta toistuu pystysuunnassa.)

Kiinteän kuvan tausta

Taustan lisääminen verkkosivustoon Vaihe 14
Taustan lisääminen verkkosivustoon Vaihe 14

Vaihe 1. Kiinteät kuvien taustat näyttävät viileiltä eivätkä muutu vierittäessäsi alaspäin

Voit tehdä ne vain tekemällä yksinkertaisia säätöjä yllä olevan osan koodiin. Tee hienosäädöt, jotta body tag näyttää tältä-

jossa SRC on taustakuvan lähde, POSITION on kuvan sijainti (se voi vaihdella keskeltä oikealle ylhäältä); taustakiinnitys on tämän taustatyypin tärkein "katalyytti". Sitä käytetään kertomaan taustan sijainti, eikä sitä suositella muutettavaksi.

Suositeltava: