CSS:n periytyminen ja kaskadi, painolaskenta, tärkeä

CSS:n periytyminen ja kaskadi, painolaskenta, tärkeää

2024-07-12

css-perintö

Lapsielementit voivat periä suoraan pääelementin tyyliattribuutit, jotka vaikuttavat alielementteihin, joten joillekin elementeille ei ole asetettu tyylejä ja myös tyylit ovat muuttuneet.

CSS-sarja

Eri valitsimet valitsevat saman elementin, ja eri attribuutit valitsimien välillä voidaan asettaa päällekkäin, ja samat määritteet korvataan painon mukaan.

Painojen laskeminen

Paino: tag=1, luokka=10, id=100, rivi(js)=1000
Tarkista ensin, onko elementti valittu. Jos se on valittu, paino lasketaan kirjoitettu.

tärkeä

<style>
		/*important只作用于当前的属性，强调非常重要，不会被后续的样式覆盖，但不影响当前的权重*/
		div p{
			color: pink;
			font-size: 15px !important;
		}
		.header p{
			color: red;
			font-size: 25px;
			
		}
	</style>
</head>
<body>
	<div class="header">
		<p>段落</p>
	</div>
</body>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

Vaikka yllä olevassa koodissa .header p:n paino on suurempi kuin div p:n, div p:n font-size-attribuutti käyttää arvoa !important, joten painoltaan suuremman fontin koon asettaminen ei vaikuta.

Teknologian jakaminen