我有这个代码。我给了我的身体一个display:flex。现在,所有子元素不都应该成为弹性项目,位于主体内部,并且主体是 1. 一个弹性容器和 2. 所有子元素的包装器吗?
因此,我尝试查看 Firefox 内的开发人员工具:align-items/justify-content对此元素没有影响,因为它\xe2\x80\x99 既不是 Flex 容器,也不是网格容器。
请向我解释一下我何时需要给每个 div、section、main、adisplay:flex单独的以及什么时候它会自动继承。
这是我的代码:
\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>\nRun 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}\nRun Code Online (Sandbox Code Playgroud)\n
小智 8
该display财产不是继承的,因此display: flex也不是。请参阅以下页面了解更多信息:
| 归档时间: |
|
| 查看次数: |
2906 次 |
| 最近记录: |