Bagaimana untuk menetapkan imej latar belakang div dalam html

WBOY
Lepaskan: 2021-11-15 11:57:44
asal
54826 orang telah melayarinya

Cara untuk menetapkan imej latar belakang div dalam HTML: 1. Gunakan atribut gaya elemen div, sintaksnya ialah "

" 2. Berikan elemen div Tambah gaya "{background-image:url(image name);}".

Bagaimana untuk menetapkan imej latar belakang div dalam html

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

Cara menetapkan imej latar belakang div dalam html

1. Sintaks untuk menambah imej latar belakang dalam div dalam html adalah seperti berikut:

<div style="width:宽度值; height:高度值; background:url(图片名称.jpg);"></div>
Salin selepas log masuk

Letakkan gambar dan halaman web dalam folder Beri perhatian kepada akhiran gambar .jpg di sini hanya sesuai untuk gambar JPG.

Kod adalah seperti berikut:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<div style="width: 200px;height: 100px;background: url(1115.08.png);"></div>
</body>
</html>
Salin selepas log masuk

Hasil keluaran:

Bagaimana untuk menetapkan imej latar belakang div dalam html

2. Anda boleh menambah "{background-image: " kepada elemen div: url(nama gambar);}" gaya untuk menetapkan imej latar belakang, kodnya adalah seperti berikut:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
<style>
.ellipse{
width: 400px;
height: 200px;
background-image: url(1115.08.png);
}
</style>
</head>
<body>
<div class="ellipse"></div>
</body>
</html>
Salin selepas log masuk

Hasil keluaran:

Bagaimana untuk menetapkan imej latar belakang div dalam html

Lebih banyak pengetahuan berkaitan pengaturcaraan, Sila lawati: Video Pengaturcaraan! !

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

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan