2017-05-25 56 views
-2

为什么#boxbody继承border?我试图在Chrome开发人员工具中检查html源代码,并注意到border未被继承。为什么边界不是从这里继承的?

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>The Box Model</title> 
<style> 

body { 
    background-color: gray; 
    margin: 0; 
    padding: 0px; 
    border: 10px solid black; 

} 

#box { 
    background-color: blue; 
    padding: 10px 10px 10px 10px; 
    width: 300px; 
} 

#content { 
    background-color: #90EE90; /*green*/ 
} 

h1 { 
    margin-bottom: 30px; 
} 

</style> 
</head> 
<body> 

<h1>Box Model</h1> 

<div id="box"> 
    <div id="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </div> 
</div> 


</body> 
</html> 
+1

默认情况下,边框不会被继承。 – inarilo

+1

我在代码中的任何地方都看不到'inherit' ..如果不指定它,它应该如何继承? –

回答

3

加上这个border: inherit;它会继承parent的border属性。

CSS:

#box { 
    background-color: blue; 
    padding: 10px 10px 10px 10px; 
    width: 300px; 
    border: inherit; 
} 
1

需要在此的继承财产。你可以添加 -

#box { 
    border: inherit; 
} 
1

在CSS ,“border”默认情况下不是继承属性。

相关问题