Menetapkan Imej Sebagai Latar Belakang untuk Jadual di Laman Web

Jadual yang membezakan dari latar belakang mereka membantu untuk menekankan kandungan jadual berbanding semua yang lain di laman web. Untuk menambah latar belakang jadual, anda perlu menaip helaian gaya berlapis (CSS) yang menyokong halaman web anda.

Bermula

Cara terbaik untuk menambah imej latar belakang ke meja adalah menggunakan CSS

latar belakang

harta. Untuk mempersiapkan diri untuk menulis CSS dengan berkesan dan untuk mengelakkan gangguan paparan yang tidak dijangka, buka imej latar belakang anda dan buat nota ketinggian dan lebar. Kemudian muat naik imej anda ke penyedia hosting anda. Uji URL untuk imej; salah satu sebab yang paling umum mengapa imej tidak dipaparkan adalah kerana terdapat kesilapan typo dalam URL. Selepas anda menyelesaikan langkah itu, letakkan blok gaya CSS di kepala dokumen anda:

Tulis CSS anda untuk latar belakang di atas meja anda dan letakkan di dalam blok gaya:
jadual {latar belakang: url (" URL ke imej ") tidak-ulang;}

Letakkan jadual anda dalam HTML:

sel 1

sel 2

sel 1

sel 2

Tetapkan lebar dan ketinggian jadual untuk memadankan lebar dan ketinggian imej.
…

Jika kandungan jadual anda lebih besar daripada ketinggian dan lebar imej, imej latar belakang hanya akan dipaparkan sekali.

Letakkan Latar Belakang di Hanya Satu Jadual

Arahan di atas akan menetapkan imej latar belakang yang sama pada setiap jadual pada halaman. Jika anda mahu meletakkan latar belakang pada jadual tertentu sahaja, anda perlu menggunakan

kelas

atribut.Ubah CSS anda untuk dibaca:
table.background {background: url (" URL ke imej ") tidak-ulang;}

Tambah kelas latar belakang ke mana-mana jadual yang anda ingin mempunyai imej latar belakang itu. Tetapkan lebar dan ketinggian untuk jadual tersebut.
kelas = "latar belakang" gaya = "lebar: 400px; ketinggian: 500px;> …

Biarkan Ulang Imej Latar Belakang Meja

Jadual yang lebih besar, atau jadual dengan lebih banyak kandungan, mungkin perlu mengulangi latar belakang supaya keseluruhan jadual dipenuhi. Tukar nilai dalam CSS anda supaya imej berulang pada paksi-y, paksi x, atau jubin pada kedua-duanya.

latar belakang: url ("URL untuk imej") ulangi;
Secara lalai nilai ulang akan dijubing, tetapi anda juga boleh menetapkan nilai ulang kepada

ulang-x
atau

ulang-y
untuk jubin secara mendatar atau menegak, masing-masing.

Warna Latar Belakang Sel Bilah Imej Latar Belakang Meja

Mana-mana warna latar belakang yang ditetapkan pada sel-sel jadual akan menimpa imej latar belakang di atas meja. Oleh itu, berhati-hati apabila menggunakan warna latar belakang pada sel anda digabungkan dengan imej latar belakang meja.

Pertimbangan

Latar belakang meja akan menetapkan jadual anda selain dari halaman asas. Walau bagaimanapun, berfikir dua kali sebelum menggunakan teknik ini. Memasukkan imej yang neutral mungkin tidak mengganggu, tetapi gambar rumit yang dimaksudkan untuk menjadi comel (contohnya, memasukkan gambar anak kucing di belakang meja yang menunjukkan penggunaan haiwan kesayangan) mungkin kelihatan tidak profesional dan boleh menjejaskan kebolehbacaan data jadual.

Mana-mana imej yang anda gunakan mesti dilesenkan dengan betul; hanya kerana anda boleh mencari gambar di Web tidak bermakna anda boleh menyesuaikannya untuk kegunaan anda sendiri. Hormati hak cipta!