Skip to main content

Postavljanje slike kao pozadine za tablicu web-stranice

Microsoft Office Word. Korak po Korak - Copy&Paste, Rad sa Slikama i ubacivanje TextBox-a (Lipanj 2024)

Microsoft Office Word. Korak po Korak - Copy&Paste, Rad sa Slikama i ubacivanje TextBox-a (Lipanj 2024)
Anonim

Diferenciranje tablica iz njihovih pozadina pomaže naglasiti sadržaj tablice u odnosu na sve drugo na web stranici. Da biste dodali pozadinu tablice, morat ćete ugađati kaskadni stilski obrazac (CSS) koji podržava vašu web stranicu.

Početak rada

Korištenje CSS-a najbolji je način dodavanja pozadinske slike u tablicu

pozadina

nekretnine. Da biste se pripremili za učinkovito pisanje CSS-a i izbjegavanje neočekivanih nedostataka prikaza, otvorite pozadinsku sliku i zabilježite visinu i širinu. Zatim prenesite svoju sliku svom pružatelju usluge hostinga. Ispitajte URL slike; jedan od najčešćih razloga zbog kojih se slike ne prikazuju je jer postoji URL pogreške. Nakon što ste završili taj korak, stavite blok stilu CSS u glavu dokumenta:

  1. Napišite svoj CSS za pozadinu na stolu i stavite ga u blok stila:

    tablica {background: url (" URL slike ") ne-ponoviti;}

    1. Stavite svoj stol u HTML:

    2. ćeliju 1

    3. stanica 2

    4. ćeliju 1

    5. stanica 2

  2. Postavite širinu i visinu tablice kako bi odgovarale širini i visini slike.

    … ​​

Ako je sadržaj tablice veći od visine i širine slike, pozadinska slika će se prikazati samo jednom.

Stavite pozadinu na samo jedan stol

Gore navedene upute postavit će istu pozadinsku sliku na svakoj tablici na stranici. Ako želite pozadinu staviti samo na određene tablice, morate upotrijebiti a

klasa

  1. atributa.Promijenite svoj CSS za čitanje:

    table.background {background: url (" URL slike ") ne-ponoviti;}

  2. Dodajte razred pozadina na bilo koji stol koji želite imati tu pozadinsku sliku. Postavite širinu i visinu za te tablice.

    class = "background" style = "width: 400px; visina: 500px;> …

Dopustite ponovnu sliku pozadine stola

Veći stolovi ili stolovi s većim sadržajem možda će trebati ponoviti pozadinu tako da se cijeli stol napuni. Promijenite vrijednost u svojem CSS-u tako da se slika ponavlja na osi y, x-osi ili je popločana na oba.

pozadina: url ("URL za sliku") ponavljanje;

Po defaultu ponovljena vrijednost će biti popločena, ali možete i postaviti ponovljenu vrijednost

ponoviti-x

ili

ponovi-y

na pločice vodoravno ili okomito, respektivno.

Boje pozadine stana blokiraju pozadinu tablice

Sve boje pozadine postavljene na ćelijama tablice nadjačat će pozadinsku sliku na stolu. Stoga budite oprezni pri korištenju pozadinskih boja na svojim ćelijama u kombinaciji sa slikama pozadine stola.

Razmatranja

Pozadina tablice postavit će vaše tablice odvojeno od osnovne stranice. Međutim, razmislite dvaput prije korištenja ove tehnike. Umetanje neutralne slike ne smije biti uznemirujuće, ali složene slike namijenjene slatkoću (na primjer, umetanje slike mačića iza tablice koja označava posvojenje kućnih ljubimaca) može se pojaviti neprofesionalno i može utjecati na čitljivost tabličnih podataka.

Svaka slika koju koristite mora biti ispravno licencirana; samo zato što možete pronaći fotografiju na webu ne znači da ga možete prilagoditi za vlastitu upotrebu. Poštujte autorska prava!