Jam's story

[CSS] inherit (상속) 본문

WEB/CSS

[CSS] inherit (상속)

애플쩀 2022. 5. 20. 11:51

부모꺼를 자식이 물려받는다. 

 

 

div{
border:1px solid red;
margin-left:50px;
}
p.ex1{
border:1px solid blue;
}

자식에 inherit 속성을 추가 

div{
border:1px solid red;
margin-left:50px;
}
p.ex1{
border:1px solid blue;
margin-left: inherit;
}

p가 부모div의 속성을 물려받았다. 

 

전체코드

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="shortcut icon" type="image/x-icon" href="../images/SiSt.ico">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">
div{
border:1px solid red;
margin-left:50px;
}
p.ex1{
border:1px solid blue;
margin-left: inherit;
}
</style>
</head>
<body>
<!-- div>p.ex1>lorem -->
<div>
	<p class="ex1">
	Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Porro suscipit vitae at recusandae sint itaque amet sit id 
numquam consequuntur dolor ipsa fugiat eligendi quae
 quibusdam beatae deserunt impedit facilis.</p>
</div>

</body>
</html>

 

 

 

저작자표시 (새창열림)

'WEB > CSS' 카테고리의 다른 글

[CSS] box model - 총넓이 , 총높이 계산  (0) 2022.05.20
[CSS] padding (안쪽여백 ) & width 속성  (0) 2022.05.20
[CSS] margin  (0) 2022.05.20
[CSS] border -css 테두리  (0) 2022.05.20
[CSS] 배경  (0) 2022.05.20
'WEB/CSS' Related Articles more
Comments