Обмен технологиями

Наследование и каскадирование CSS, расчет веса, важно

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

CSS наследование

Дочерние элементы могут напрямую наследовать атрибуты стиля родительского элемента, которые будут влиять на дочерние элементы, поэтому для некоторых элементов не установлены стили, и стили также изменились.

CSS-каскадирование

Разные селекторы выбирают один и тот же элемент, при этом разные атрибуты между селекторами могут накладываться, и одни и те же атрибуты будут перезаписаны в зависимости от веса.

Расчет весов

Вес: тег=1, категория=10, идентификатор=100, строка(js)=1000.
Сначала проверьте, выбран ли элемент. Если он не выбран, вес равен 0. Если он выбран, будет рассчитываться вес с наибольшим весом. Если веса одинаковы, будет выбран окончательный стиль. написано.

важный

<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

В приведенном выше коде, хотя вес .header p больше, чем у div p, атрибут font-size div p использует !important, поэтому установка размера шрифта с большим весом не вступит в силу.

Личный профиль

Он посвятил себя исследованию технологий более тридцати лет, владеет различными языками, такими как Java, Linux, Javascript, php, css и т. д., и внес большой вклад в созданную им область открытого исходного кода. станция документации для разработчиков, где можно поделиться некоторыми проблемами разработки технологий для дальнейшего использования.

моя контактная информация

Почта