Rumah > Artikel > hujung hadapan web > Bagaimana untuk menukar saiz imej latar belakang dalam css

Bagaimana untuk menukar saiz imej latar belakang dalam css

青灯夜游asal: 2021-11-10 17:05:5130250semak imbas

Dalam CSS, anda boleh menukar saiz imej latar belakang dengan menetapkan gaya atribut saiz latar belakang untuk imej latar belakang Fungsi atribut ini adalah untuk menentukan saiz imej latar belakang -saiz: nilai lebar nilai ketinggian;

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

Dalam CSS, anda boleh menukar saiz imej latar belakang dengan menetapkan gaya atribut saiz latar belakang kepada imej latar belakang.

Atribut saiz latar belakang menentukan saiz imej latar belakang.

Sintaks: background-size: length|percentage|cover|contain;

panjang Tetapkan ketinggian dan lebar imej latar belakang. Nilai pertama menetapkan lebar, dan nilai kedua menetapkan ketinggian. Jika hanya satu nilai diberikan, yang kedua ditetapkan kepada auto (automatik)
peratusan akan mengira peratusan kawasan kedudukan berbanding latar belakang. Nilai pertama menetapkan lebar, dan nilai kedua menetapkan ketinggian. Jika hanya satu nilai diberikan, nilai kedua ditetapkan kepada "auto"
penutup yang akan mengekalkan nisbah bidang imej dan menskalakan imej untuk menutup sepenuhnya kedudukan latar belakang Minimum saiz wilayah.
mengandungi akan mengekalkan nisbah bidang imej dan menskalakan imej kepada saiz maksimum yang sesuai dalam kawasan kedudukan latar belakang.

Contoh:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<style>
			div{
				width: 400px;
				height: 224px;
			}
			.box1{
				background:url(img/2.jpg) no-repeat;
			}
			.box2{
				background:url(img/2.jpg) no-repeat;
				background-size: 200px 160px;
				
			}
		</style>
	</head>

	<body>
		<p><strong>原始图片大小</strong></p> 
		
		<div class="box1"></div> 
		<p>本身这个图片宽度为400px，高度224px</p>
		<br />
		<p><strong>通过CSS background-size修改后的背景图片</strong></p> 
		<div class="box2"></div>
	</body>

</html>

Bagaimana untuk menukar saiz imej latar belakang dalam css

(Mempelajari perkongsian video: tutorial video css)

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

html5 css css3 auto Length background

Kenyataan：

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

Artikel sebelumnya：Bagaimana untuk menetapkan bayangan imej dalam cssArtikel seterusnya：Bagaimana untuk menetapkan bayangan imej dalam css

Artikel berkaitan

Lihat lagi