상속을 시작하기 쉬운 HTML+CSS

CSS는 캐스케이딩 스타일 시트(Cascading Style Sheet)의 약어로, 그 사양은 인터넷 역사에서 독특한 발전 단계를 나타냅니다. 요즘에는 웹페이지 제작에 종사하는 친구들이 CSS를 들어본 적이 거의 없습니다. 웹페이지를 만드는 과정에서 CSS를 사용해야 하는 경우가 많기 때문입니다.
CSS를 사용하면 문서의 모양을 더욱 풍부하고 수정하기 쉽게 설정할 수 있어 웹 디자이너의 작업 부담을 줄일 수 있습니다. 여기서 우리는 주로 CSS의 상속과 특수성에 대해 친구들과 심도 있는 토론을 하고 싶습니다.

1. 상속
CSS의 주요 기능 중 하나는 조상-후손에 의존하는 상속입니다. 관계. 상속은 특정 요소뿐만 아니라 그 하위 요소에도 스타일을 적용할 수 있도록 하는 메커니즘입니다.

상속은 특정 html 태그 요소뿐만 아니라 다른 요소에도 스타일을 적용할 수 있도록 하는 규칙입니다. 그 후손. 예를 들어 다음 코드는 p 태그에 특정 색상이 적용되면 이 색상 설정이 p 태그에만 적용되는 것이 아니라 p 태그

p{에 있는 모든 하위 요소 텍스트에도 적용됩니다. color:red}

p 태그가 있는 경우 p 태그 내의 모든 요소는 p 태그의 스타일을 사용합니다

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>继承</title>
	<style type="text/css">
		p{
			color:red;
		}
	</style>
</head>
<body>
	<p> css继承性
		<span>重要性</span>
	</p>
</body>
</html>

2. CSS 상속의 제한

CSS에서 상속은 매우 자연스러운 동작이므로 이를 수행할 수 있는지 고려할 필요조차 없지만 상속에는 한계가 있습니다.

우선, 일부 속성은 상속될 수 없습니다. 딱히 이유는 없고 그냥 그렇게 설정되어 있으니까요. 예: border 속성 우리 모두 알고 있듯이 border 속성은 요소의 테두리를 설정하는 데 사용되며 상속이 없습니다. 안쪽 여백, 여백, 배경 및 테두리 속성과 같은 대부분의 테두리 속성은 상속될 수 없습니다.

3. 상속에서 발생하기 쉬운 오류

때로는 상속에도 오류가 발생할 수 있습니다

4. 여러 스타일을 혼합하여 적용

상속이 없으면 스타일시트를 적용하는 것에 대해 일부 독자들은 혼란스러울 수 있습니다. 여러 스타일시트를 하나의 객체에 동시에 적용하면 어떻게 될까요?

5. CSS 상속의 우선순위 문제

문서에 가까운 CSS 스타일을 사용하세요

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>继承</title> <style type="text/css"> p{ color:red; } </style> </head> <body> <p> css继承性 <span>重要性</span> </p> </body> </html>

제출하다 코드 재설정

자동운전