Cara Menambah Latar Belakang ke Laman Web: 14 Langkah (dengan Gambar)

Isi kandungan:

Cara Menambah Latar Belakang ke Laman Web: 14 Langkah (dengan Gambar)
Cara Menambah Latar Belakang ke Laman Web: 14 Langkah (dengan Gambar)

Video: Cara Menambah Latar Belakang ke Laman Web: 14 Langkah (dengan Gambar)

Video: Cara Menambah Latar Belakang ke Laman Web: 14 Langkah (dengan Gambar)
Video: Cara Pulihkan Email Yahoo Lupa Kata Sandi 2024, Mungkin
Anonim

Latar belakang adalah salah satu elemen penting dalam laman web. Latar belakang yang baik mencipta nada untuk laman web dan melengkapkan kandungannya. Terdapat banyak cara untuk menambahkan latar belakang, setiap cara dengan tujuan yang berbeza. Beberapa kaedah membolehkan anda menerapkan latar belakang ke semua halaman di laman web, sementara yang lain membatasi latar belakang hanya pada halaman tertentu. Artikel ini mengajar anda cara menambahkan latar belakang ke laman web anda menggunakan HTML atau CSS.

Langkah-langkah

Kaedah 1 dari 2: Kaedah HTML

Latar Belakang Berwarna Pepejal

Tambahkan Latar Belakang ke Laman Web Langkah 1
Tambahkan Latar Belakang ke Laman Web Langkah 1

Langkah 1. Latar belakang berwarna padat adalah jenis latar belakang yang paling asas yang boleh anda letakkan di laman web

Sebenarnya, setiap laman web bermula dengan latar belakang putih lalai. Walau bagaimanapun, walaupun latar belakang putih kelihatan sangat ramping dan bersih ketika digunakan dengan skema warna yang harmoni, latar belakang warna yang berbeza mungkin disukai dengan tema yang berbeza.

Tambahkan Latar Belakang ke Laman Web Langkah 2
Tambahkan Latar Belakang ke Laman Web Langkah 2

Langkah 2. Buka kod web anda (sumber)

Tambahkan Latar Belakang ke Laman Web Langkah 3
Tambahkan Latar Belakang ke Laman Web Langkah 3

Langkah 3. Pada teg badan, tambahkan atribut yang disebut bgcolor

Sekarang, tanda badan anda akan kelihatan seperti ini-

di mana COLORNAME adalah nama warna. COLORNAME boleh diisi dengan banyak jenis wakil warna-

  • (nama warna)
  • (nilai hex)
  • (Nilai RGB)
Tambahkan Latar Belakang ke Laman Web Langkah 4
Tambahkan Latar Belakang ke Laman Web Langkah 4

Langkah 4. Mengeksperimen dengan RGB dan # boleh menghasilkan banyak warna, tetapi anda boleh mengambil jalan pertama yang mudah

Tetapi ingat bahawa mengetik warna yang tidak biasa sebagai "Ultramarine Bluish Green" akan menghasilkan warna putih.

Menambah Imej Latar Belakang

Menambah gambar latar sedikit lebih rumit daripada latar belakang berwarna padat

Tambahkan Latar Belakang ke Laman Web Langkah 5
Tambahkan Latar Belakang ke Laman Web Langkah 5

Langkah 1. Tambahkan sifat latar belakang pada teg badan, sehingga kelihatan seperti ini-

di mana SRC adalah sumber gambar SRC boleh berada di folder yang sama, atau folder / halaman web lain.

  • (dalam folder yang sama)
  • (di dalam folder yang berbeza)
  • (di laman web yang berbeza)
Tambahkan Latar Belakang ke Laman Web Langkah 6
Tambahkan Latar Belakang ke Laman Web Langkah 6

Langkah 2. Ingatlah untuk memasukkan lanjutan.gif /-j.webp" />

Kaedah 2 dari 2: Kaedah CSS

Menambah Latar Belakang ke Laman Web Langkah 6
Menambah Latar Belakang ke Laman Web Langkah 6

Latar Belakang Berwarna Pepejal

Tambahkan Latar Belakang ke Laman Web Langkah 7
Tambahkan Latar Belakang ke Laman Web Langkah 7

Langkah 1. Untuk menambahkan latar belakang berwarna padat di CSS, tambahkan atribut gaya

Anda juga boleh memberikan ID dan Kelas dan menggunakan lembaran gaya luaran dan dalaman.

Tambahkan Latar Belakang ke Laman Web Langkah 8
Tambahkan Latar Belakang ke Laman Web Langkah 8

Langkah 2. Tanda badan anda akan kelihatan seperti ini-

di mana COLORNAME adalah nama warna, nilai hex atau RGB (Juga ingat langkah terakhir latar belakang berwarna padat dalam HTML, yang berlaku juga di sini).

Menambah Imej

Menambah Latar Belakang ke Laman Web Langkah 9
Menambah Latar Belakang ke Laman Web Langkah 9

Langkah 1. Untuk menambah gambar, tambahkan atribut gaya ke tanda badan

Anda juga boleh memberikan ID dan Kelas dan menggunakan lembaran gaya luaran dan dalaman.

Tambahkan Latar Belakang ke Laman Web Langkah 10
Tambahkan Latar Belakang ke Laman Web Langkah 10

Langkah 2. Tanda badan anda kini kelihatan seperti ini-

Menambah Latar Belakang ke Laman Web Langkah 11
Menambah Latar Belakang ke Laman Web Langkah 11

Langkah 3. Ingat bahawa SRC adalah sumbernya

Ini boleh dari folder yang sama, folder yang berbeza atau halaman web yang berbeza.

  • (dalam folder yang sama)
  • (di dalam folder yang berbeza)
  • (di laman web yang berbeza).
Tambahkan Latar Belakang ke Laman Web Langkah 12
Tambahkan Latar Belakang ke Laman Web Langkah 12

Langkah 4. Ingatlah untuk menambahkan.extensions juga

Mengulangi Latar Belakang Berpola

Menambah Latar Belakang ke Laman Web Langkah 13
Menambah Latar Belakang ke Laman Web Langkah 13

Langkah 1. Untuk membuat latar belakang corak berulang, tambahkan latar belakang seperti yang dinyatakan dalam langkah-langkah di atas

Tanda badan anda kini mesti ditukar menjadi-

Di mana REPEAT-SETTINGS adalah tetapannya. Terdapat banyak tetapan berulang, seperti-

  • (Latar belakang akan berulang secara menegak dan mendatar.)
  • (Latar belakang akan berulang secara mendatar.)
  • (Latar belakang akan berulang secara menegak.)

Memperbaiki Latar Belakang Gambar

Menambah Latar Belakang ke Laman Web Langkah 14
Menambah Latar Belakang ke Laman Web Langkah 14

Langkah 1. Latar belakang gambar yang tetap kelihatan keren dan tidak berubah semasa anda menatal ke bawah

Untuk melakukannya, anda hanya perlu melakukan sedikit perubahan pada kod di bahagian di atas. Lakukan penyesuaian untuk menjadikan tanda badan kelihatan seperti ini-

di mana SRC adalah sumber gambar latar, POSISI adalah kedudukan gambar (ia boleh berkisar dari tengah ke kanan atas); latar belakang-lampiran adalah "pemangkin" utama jenis latar belakang ini. Ini digunakan untuk memberitahu kedudukan latar belakang dan disarankan agar tidak diubah.

Disyorkan: