Dalam CSS, anda boleh menggunakan atribut "background-repeat" untuk menjadikan imej latar belakang tidak berjubin Atribut ini digunakan untuk menetapkan mod jubin imej latar belakang. repeat:no-repeat;" kepada elemen. ” gaya untuk mengelakkan imej latar belakang daripada dipaparkan berjubin.
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3&&HTML5, komputer Dell G3.
Cara membuat imej latar belakang tidak boleh jubin dalam css
Dalam css, anda boleh menggunakan atribut ulangan latar belakang untuk menetapkan latar belakang imej tidak boleh jubin, atribut ulang latar belakang Tetapkan sama ada dan cara mengulang imej latar belakang. Secara lalai, imej latar belakang berulang secara mendatar dan menegak. Atribut ulangan latar belakang mentakrifkan mod jubin imej.
Nilai atribut adalah seperti berikut:
Mari kita lihat contoh:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body{
background-image: url(1118.02.png);
}</style>
</head>
<body>
</body>
</html>Hasil output:
Selepas menambah gaya sehingga:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body{
background-image: url(1118.02.png);
background-repeat: no-repeat;
}</style>
</head>
<body>
</body>
</html>Hasil keluaran:
(Ketahui perkongsian Video: tutorial video css)
Atas ialah kandungan terperinci Bagaimana untuk membuat imej latar belakang tidak boleh jubin dengan css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
