Bagaimana untuk memaparkan imej latar belakang sepenuhnya dalam css

Dalam CSS, anda boleh menggunakan atribut "background-size" untuk memaparkan imej latar belakang sepenuhnya Atribut ini digunakan untuk menentukan saiz imej latar belakang Anda hanya perlu menambah "background-size:100 % 100%;" kepada elemen. Gaya boleh memaparkan imej latar belakang sepenuhnya.

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.

Cara untuk memaparkan imej latar belakang sepenuhnya dalam css

Apabila menggunakan div css untuk mencipta halaman web, kadangkala perlu untuk memaparkan keseluruhan imej latar belakang dalam div. Jadi, bagaimana untuk menggunakan tetapan css? Contoh berikut menerangkan cara menggunakan div css untuk mengawal paparan penuh imej latar belakang.

1. Cipta fail html baharu, bernama test.html, untuk menerangkan cara div css mengawal paparan penuh imej latar belakang. Buat modul menggunakan tag div untuk menambah imej latar belakang. Tetapkan atribut kelas teg div kepada mydiv, yang digunakan terutamanya untuk menetapkan gaya css melalui kelas ini di bawah. Tulis teg dan gaya CSS halaman akan ditulis dalam teg.

Tetapkan gaya css div melalui nama kelas mydiv, gunakan atribut lebar untuk menetapkan lebar div kepada 300px dan gunakan atribut ketinggian untuk menetapkan ketinggian div kepada 300px.

2 Dalam teg css, tetapkan imej latar belakang div kepada imej 1.jpg di bawah folder imej melalui atribut imej latar belakang dan gunakan latar belakang. -tetapan saiz Nisbah lebar dan ketinggian imej latar belakang adalah 100%, iaitu keseluruhan imej latar belakang dipaparkan.

Buka fail test.html dalam penyemak imbas untuk melihat kesannya.

Ringkasan:

1.

2. Cipta modul div dalam fail.

3. Dalam teg css, tetapkan lebar, ketinggian dan imej latar belakang div, kemudian tetapkan lebar dan ketinggian latar belakang kepada 100% melalui atribut saiz latar belakang untuk memaparkan keseluruhan imej latar belakang.

Nota:

Jika nisbah lebar div berbeza daripada nisbah lebar dan ketinggian imej, tetapan imej latar belakang akan dipaparkan sepenuhnya, yang akan menyebabkan ubah bentuk.

(Mempelajari perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Bagaimana untuk memaparkan imej latar belakang sepenuhnya dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!