Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk memilih hanya baris bernombor genap dalam css

Bagaimana untuk memilih hanya baris bernombor genap dalam css

青灯夜游
青灯夜游asal
2021-11-10 14:05:1911183semak imbas

Dalam CSS, anda boleh menggunakan pemilih kelas pseudo ":nth-child()" untuk memilih baris bernombor genap ini boleh memilih baris bernombor genap elemen biasa seperti jadual atau li sintaks "Element:nth" -child(2n){style}" atau "element:nth-child(even){style}".

Bagaimana untuk memilih hanya baris bernombor genap dalam css

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

Dalam CSS, anda boleh menggunakan pemilih kelas pseudo ":nth-child()" untuk memilih baris genap. Menggunakan pemilih kelas pseudo css3 :nth-child(), anda boleh memilih baris genap elemen biasa seperti jadual atau li. Pemilih

:nth-child(n) sepadan dengan nelemen anak ke dalam elemen induk dan tiada sekatan pada jenis elemen. n boleh menjadi nombor, kata kunci atau formula.

Apabila n ialah kata kunci "genap" atau formula "2n", anda boleh memilih baris genap.

Sintaks untuk memilih baris genap:

元素:nth-child(2n){样式}

元素:nth-child(even){样式}

Contoh:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<style>
			p:nth-child(2n)
			{
				background:#ff0000;
			}
			li:nth-child(even){
				background: #AFEEEE;
			}
			
		</style>
	</head>
	<body>
		<div>
			<p>这是第一个段落。</p>
			<p>这是第二个段落。</p>
			<p>这是第三个段落。</p>
			<p>这是第四个段落。</p>
		</div>
		<ul>
			<li>第一项</li>
			<li>第二项</li>
			<li>第三项</li>
			<li>第四项</li>
		</ul>
	</body>
</html>

Rendering:

Bagaimana untuk memilih hanya baris bernombor genap dalam css

(Belajar perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Bagaimana untuk memilih hanya baris bernombor genap dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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