1. 상속이란?
상위요소에 특정한 css속성을 적용 했을때에 하위요소들에게도 적용되는 현상!
<!-- ex -->
<head>
<style>
.container {
color: red;
}
</style>
</head>
<body>
<div class="container">hello
<div>hi
<div>good <!-- 하위요소의 모든 글자색이 빨간색으로 변경됨-->
<div>bye</div>
<div>world</div>
</div>
</div>
</div>
</body>이런 경우를 말한다.
2. 상속되는 속성들
font 관련 속성들, color, text-align, text-indent, text-decoration, letter-spacing, opacity 등...
글자를 다루는 속성들이 주로 적용된다.
3.
3. 강제 상속
상속이 되지 않는 부모요소의 속성을 강제로 상속시킨다.
<!-- ex -->
<div class="container">
<div class="box"></div>
</div>
.container {
position: absolute;
}
.box {
position: inherit;
}위처럼 자식요소의 속성 값에 inherit 를 입력하면 부모요소의 값이 강제상속이 된다.
마지막으로 id가 class보다 더 우선순위에 있다.!
'웹 프로그래밍(풀스택-->java)' 카테고리의 다른 글
| 10. css selector (0) | 2021.06.13 |
|---|---|
| 9. 상속과 우선순위 결정 -2 (0) | 2021.06.13 |
| 4. 웹프론트엔드의 이해 (0) | 2021.06.13 |
| 6. 웹 서버란? (0) | 2021.06.13 |
| 5. 파싱이란 무었인가? (0) | 2021.06.13 |
