Cara Menetapkan Latar Belakang Di Laman Web

Isi kandungan:

Cara Menetapkan Latar Belakang Di Laman Web
Cara Menetapkan Latar Belakang Di Laman Web

Video: Cara Menetapkan Latar Belakang Di Laman Web

Video: Cara Menetapkan Latar Belakang Di Laman Web
Video: CSS Dasar - 6 - Background 2024, Mungkin
Anonim

Reka bentuk mana-mana laman web berdasarkan gambar latar belakang dan warna, seperti rumah di pondasi. Sekiranya anda mempunyai keinginan untuk mengganti asas khas sumber Internet anda dengan sesuatu yang lebih individu, maka anda harus bermula dengan pengembangan reka bentuknya. Dan apabila sudah siap, bahagian teknikal yang murni akan tetap ada, iaitu menggantikan reka bentuk lama latar belakang laman web yang ditentukan dalam kod sumber halaman dengan yang baru. Terdapat beberapa cara untuk melaksanakannya dalam praktik.

Cara menetapkan latar belakang di laman web
Cara menetapkan latar belakang di laman web

Arahan

Langkah 1

Mula-mula anda perlu mengetahui cara mana latar belakang ditetapkan dalam versi laman web semasa. Untuk melakukan ini, buka kod HTML halaman. Anda boleh melakukannya dengan penyunting teks ringkas dengan memuat turun fail dari pelayan terlebih dahulu. Atau anda boleh menggunakan penyunting halaman sistem pengurusan kandungan, jika anda menggunakannya. Editor halaman tidak memerlukan memuat turun fail, tetapi mengubahnya secara langsung di pelayan menggunakan penyemak imbas sebagai antara muka. Kod HTML (HyperText Markup Language) halaman yang anda buka terdiri daripada baris arahan untuk penyemak imbas. Mereka menerangkan jenis, penampilan, dan lokasi setiap elemen halaman web. Arahan ini biasanya disebut sebagai "tag". Urutan tag itu sendiri dalam kod halaman juga mematuhi peraturan bahasa HTML - ia dibahagikan kepada blok, yang pertama mesti menjadi blok tajuk yang dimulai dengan tag dan berakhir. Ia mesti diikuti dengan blok yang lebih menarik minat anda sekarang - badan dokumen. Ia terhad pada tag dan. Pada tag pembuka blok ini (), anda boleh meletakkan maklumat mengenai latar belakang halaman. Maklumat sedemikian dalam tag disebut "atribut". Atribut tag badan yang menetapkan warna latar belakang dilambangkan sebagai bgcolor dan dalam kodnya mungkin terlihat seperti ini: Di sini kita menetapkan warna latar untuk halaman menjadi perak. Penyemak imbas dapat mengenali beberapa warna dengan nama mereka, tetapi agar tidak tersalah, lebih baik menunjukkan kod heksadesimal mereka. Versi ini dengan warna perak dalam ungkapan heksadesimal akan kelihatan seperti ini: Oleh itu, anda perlu mencari tanda bermula dengan <badan dalam kod halaman dan periksa apakah ia mempunyai warna latar belakang. Sekiranya ada, ganti petunjuk warna di dalamnya dengan versi baru anda dan simpan perubahan ke halaman.

Langkah 2

Latar belakang dalam reka bentuk laman web anda sekarang tidak dapat disusun berdasarkan warna, tetapi oleh gambar. Atribut yang sesuai dari tag badan disebut latar belakang, dan ia boleh kelihatan seperti ini dalam kod: Di sini, latar belakang adalah gambar bg.jpg

Langkah 3

Semasa menerangkan penampilan halaman dengan reka bentuk yang agak kompleks, gunakan "cascading style sheet" - CSS (Cascading Style Sheets). Blok kod CSS dapat dimasukkan secara langsung dalam kod halaman atau terkandung dalam fail luaran dengan pelanjutan "css". Anda perlu mencari tag deskripsi gaya bermula dengan <style di bahagian header kod halaman (antara dan tag). Sekiranya mengandungi pautan ke fail luaran, ia akan kelihatan seperti ini: @import "style.css"; Berikut adalah pautan ke helaian gaya bernama style.css. Anda perlu membuka fail yang ditentukan untuk diedit. Dan jika tidak ada pautan, dan setelah <style style tag ada petunjuk gaya, maka anda perlu mengeditnya di sini. Dalam kedua-dua pilihan, di antara perihalan gaya, anda perlu mencari yang berkaitan dengan badan dokumen (badan). Blok keterangan ini mungkin kelihatan seperti ini: badan {

warna latar: Perak;

warna: Hitam;

} Di sini anda perlu mengganti nilai parameter warna latar dengan nilai warna baru anda dan lebih baik dalam nilai heksadesimal yang sama. Pilihan gambar latar dalam arahan CSS akan kelihatan seperti ini: body {

latar belakang: # C0C0C0 url (img / bg.jpg) berulang-y;

warna: Hitam;

} Di sini pautan ke gambar serupa dengan yang dibincangkan di atas, dan # C0C0C0 sebelum pautan bermaksud bahawa ruang halaman yang tidak dihuni oleh gambar latar akan mempunyai latar belakang perak. "Ulang-y" menunjukkan bahawa gambar latar harus dikalikan sepanjang paksi Y (menegak)."Ulangan-y" dapat diganti dengan "ulangan-x" (replikasi mendatar) atau "tidak ulangi" (jangan ulangi). Sekiranya anda tidak menentukan pengulangan sama sekali, maka gambar latar akan dijubin ke ruang latar belakang halaman ke semua arah.

Disyorkan: