Jak přidat pozadí na web: 14 kroků (s obrázky)

Obsah:

Jak přidat pozadí na web: 14 kroků (s obrázky)
Jak přidat pozadí na web: 14 kroků (s obrázky)

Video: Jak přidat pozadí na web: 14 kroků (s obrázky)

Video: Jak přidat pozadí na web: 14 kroků (s obrázky)
Video: How To Change Yahoo Email Username (2023) 2024, Duben
Anonim

Pozadí je jedním z nejdůležitějších prvků webové stránky. Dobré pozadí vytváří tón pro web a doplňuje obsah. Existuje mnoho různých způsobů, jak přidat pozadí, přičemž každý způsob má jiný účel. Některé metody umožňují použít pozadí na všechny stránky na webu, zatímco jiné omezují pozadí pouze na určitou stránku. Tento článek vás naučí, jak přidat pozadí na svůj web pomocí HTML nebo CSS.

Kroky

Metoda 1 ze 2: Metody HTML

Jednobarevné pozadí

Přidání pozadí na web Krok 1
Přidání pozadí na web Krok 1

Krok 1. Jednobarevné pozadí je nejzákladnějším typem pozadí, které můžete na web umístit

Ve skutečnosti každý web začíná výchozím bílým pozadím. Zatímco při použití s harmonickým barevným schématem může být bílé pozadí velmi elegantní a čisté, může být upřednostňováno jiné barevné pozadí s různými motivy.

Přidání pozadí na web Krok 2
Přidání pozadí na web Krok 2

Krok 2. Otevřete svůj webový kód (zdroj)

Přidání pozadí na web Krok 3
Přidání pozadí na web Krok 3

Krok 3. Do tagu body přidejte atribut nazvaný bgcolor

Nyní by vaše značka těla měla vypadat takto-

kde COLORNAME je název barvy. COLORNAME lze naplnit mnoha druhy barevných zástupců-

  • (název barvy)
  • (hexadecimální hodnota)
  • (Hodnota RGB)
Přidejte pozadí na web Krok 4
Přidejte pozadí na web Krok 4

Krok 4. Experimentování s RGB a # může vést k mnoha odstínům, ale můžete jít snadno první cestou

Pamatujte však, že zadáním neobvyklé barvy jako „Ultramarine Bluish Green“bude bílá barva.

Přidání obrázku na pozadí

Přidání obrázku na pozadí je o něco složitější než jednobarevné pozadí

Přidání pozadí na web Krok 5
Přidání pozadí na web Krok 5

Krok 1. Přidejte do značky body vlastnost background, aby vypadala takto-

kde SRC je zdrojem obrázku SRC může být ve stejné složce nebo jiné složce/webové stránce.

  • (ve stejné složce)
  • (v jiné složce)
  • (na jiné webové stránce)
Přidání pozadí na web Krok 6
Přidání pozadí na web Krok 6

Krok 2. Nezapomeňte zadat příponu.gif /-j.webp" />

Metoda 2 ze 2: Metody CSS

Přidání pozadí na web Krok 6
Přidání pozadí na web Krok 6

Jednobarevné pozadí

Přidání pozadí na web Krok 7
Přidání pozadí na web Krok 7

Krok 1. Chcete -li do CSS přidat jednobarevné pozadí, přidejte atribut stylu

Můžete také zadat ID a třídy a používat externí i interní šablony stylů.

Přidání pozadí na web Krok 8
Přidání pozadí na web Krok 8

Krok 2. Vaše značka těla by měla vypadat takto-

kde COLORNAME je název barvy, hexadecimální hodnoty nebo RGB (pamatujte také na poslední kroky jednobarevného pozadí v HTML, platí zde také).

Přidání obrázku

Přidání pozadí na web Krok 9
Přidání pozadí na web Krok 9

Krok 1. Chcete -li přidat obrázek, přidejte do tagu body atribut style

Můžete také zadat ID a třídy a používat externí i interní šablony stylů.

Přidání pozadí na web Krok 10
Přidání pozadí na web Krok 10

Krok 2. Vaše značka těla by nyní měla vypadat takto-

Přidání pozadí na web Krok 11
Přidání pozadí na web Krok 11

Krok 3. Pamatujte, že zdrojem je SRC

Může to být ze stejné složky, jiné složky nebo jiné webové stránky.

  • (ve stejné složce)
  • (v jiné složce)
  • (na jiné webové stránce).
Přidání pozadí na web Krok 12
Přidání pozadí na web Krok 12

Krok 4. Nezapomeňte přidat také.extensions

Opakující se vzorované pozadí

Přidání pozadí na web Krok 13
Přidání pozadí na web Krok 13

Krok 1. Chcete -li vytvořit pozadí s opakovaným vzorem, přidejte pozadí podle výše uvedených kroků

Vaše značka těla musí být nyní změněna na-

Kde jsou nastavení OPAKOVÁNÍ. Může existovat mnoho nastavení opakování, například-

  • (Pozadí se bude opakovat svisle i vodorovně.)
  • (Pozadí se bude opakovat vodorovně.)
  • (Pozadí se bude vertikálně opakovat.)

Opravené pozadí obrázku

Přidejte pozadí na web Krok 14
Přidejte pozadí na web Krok 14

Krok 1. Pozadí pevného obrázku vypadá skvěle a při posouvání dolů se nemění

Chcete -li to provést, stačí provést několik jednoduchých vylepšení kódu ve výše uvedené části. Proveďte vylepšení, aby značka na těle vypadala takto-

kde SRC je zdrojem obrázku na pozadí, POSITION je poloha obrázku (může se pohybovat od středu k pravému hornímu rohu); připojení na pozadí je hlavním „katalyzátorem“tohoto typu pozadí. Slouží k určení polohy pozadí a doporučuje se, aby nebyla změněna.

Doporučuje: