Nastavitev slike kot ozadja za mizo na spletni strani

click fraud protection

Ločevanje tabel od njihovega ozadja pomaga poudariti vsebino tabele glede na vse ostalo na spletni strani. Če želite dodati ozadje tabele, boste morali spremeniti datoteko kaskadni slog podporo vaši spletni strani.

Sodobne poslovne stavbe, ki so del regeneracije polotoka Greenwich, jugovzhodni London, Velika Britanija
Gradbena fotografija / Avalon / Getty Images

Kako začeti

Najboljši način za dodajanje slike ozadja v tabelo je uporaba CSS ozadje lastnine. Če se želite pripraviti na učinkovito pisanje CSS in se izogniti nepričakovanim napakam na zaslonu, odprite sliko v ozadju in si zapišite višino in širino. Nato naložite sliko ponudniku gostovanja. Preizkusite URL slike; eden najpogostejših razlogov, zakaj se slike ne prikazujejo, je, da je v URL-ju natipkana beseda.

V glavo dokumenta vstavite blok sloga CSS:


Napišite CSS za ozadje na mizo in ga vstavite v blok sloga:

Postavite tabelo v HTML:

celica 1celica 2
celica 1celica 2
Širino in višino tabele nastavite tako, da se ujemata s širino in višino slike.

Širino in višino tabele nastavite tako, da se ujemata s širino in višino slike.

instagram viewer

Če je vsebina tabele večja od višine in širine slike, se slika v ozadju prikaže samo enkrat.

Postavite ozadje na samo eno mizo

Zgornja navodila bodo nastavila enako sliko ozadja za vsako tabelo na strani. Če želite postaviti ozadje samo na določene tabele, uporabite a razred atribut. Dodajte razredozadje v katero koli tabelo, za katero želite imeti sliko v ozadju. Nastavite širino in višino za te tabele.

Naj se slika v ozadju tabele ponovi

Pri večjih tabelah ali tabelah z več vsebine se bo morda moralo ozadje ponoviti, da bo zapolnjena celotna tabela. Spremenite vrednost v CSS-ju, tako da se slika ponovi na osi y, osi x ali je na obeh popločana.

ozadje: url ("URL na sliko") ponovitev; 

Privzeto bo vrednost ponovitve postavljena na ploščice, lahko pa nastavite tudi vrednost ponovitve.

ponovite-x

ali.

ponovite-y

za ploščice vodoravno oziroma navpično.

Barve ozadja celic blokirajo sliko ozadja tabele

Vse barve ozadja celice tabele preglasijo sliko ozadja tabele. Zato bodite previdni pri uporabi barv ozadja na celicah v kombinaciji s slikami ozadja tabele.

Premisleki

Vsaka slika, ki jo uporabljate, mora biti ustrezno licencirana; samo zato, ker lahko v spletu najdete fotografijo, še ne pomeni, da si jo lahko prilagodite za lastno uporabo. Spoštujte avtorske pravice!

Ozadja tabel ločujejo vaše tabele od osnovne strani. Vendar dobro premislite, preden uporabite to tehniko. Vstavljanje nevtralne slike morda ne moti, ampak zapletene slike naj bi bile ljubke (na primer vstavljanje slika mačka za mizo, ki označuje posvojitve hišnih ljubljenčkov), se lahko zdi neprofesionalna in lahko vpliva na berljivost tabelarni podatki.

instagram story viewer