display:flex 是继承的吗?

Yun*_*iac 3 html css flexbox

我有这个代码。我给了我的身体一个display:flex。现在,所有子元素不都应该成为弹性项目,位于主体内部,并且主体是 1. 一个弹性容器和 2. 所有子元素的包装器吗?

\n

因此,我尝试查看 Firefox 内的开发人员工具:align-items/justify-content对此元素没有影响,因为它\xe2\x80\x99 既不是 Flex 容器,也不是网格容器。

\n

请向我解释一下我何时需要给每个 div、section、main、adisplay:flex单独的以及什么时候它会自动继承。

\n

这是我的代码:

\n
#html \n<!DOCTYPE html>\n<html lang="en">\n\n<head>\n    <meta charset="UTF-8">\n    <meta name="viewport" content="width=device-width, initial-scale=1.0">\n    <link rel="stylesheet" href="style.css">\n    <title>Butterfly Music App</title>\n</head>\n\n<body>\n    <main>\n\n    </main>\n    <footer>\n\n    </footer>\n</body>\n\n</html>\n
Run Code Online (Sandbox Code Playgroud)\n
#css\nhtml, body {\n    height: 100%;\n}\nbody {\n    display: flex;\n    flex-direction: column;\n    background-color: cyan;\n    font-family: gabriola;\n    color: purple;\n}\nfooter {\n    justify-content: flex-end;\n    align-items: flex-start;\n    flex: 0 0 120px;\n    background-color: pink;\n}\n
Run Code Online (Sandbox Code Playgroud)\n

小智 8

display财产不是继承的,因此display: flex也不是。请参阅以下页面了解更多信息: