容器、块和引导网格之间的关系是什么？答案

【问题标题】：What is the relationship between the container, the blocks and the bootstrap grid?容器、块和引导网格之间的关系是什么？
【发布时间】：2018-03-05 05:35:51
【问题描述】：

我已经开始在 freecodecamp 上学习编码，但对容器、内联、块、内联块和引导 12 列系统感到困惑。

容器和块有什么区别？
我是否绝对需要两者以及为什么？
如果我使用引导程序，为什么我需要了解内联元素和块元素？例如，我可以只使用 Bootstrap “col-xs-12”，我的元素是内联还是阻塞都没有关系，因为它们会采用父元素的格式。

我已经搜索了容器和块（内联块）之间的区别，但它只解释了它们各自的作用，据我所知，它们做同样的事情，将网站划分为可以设置样式和调整大小。块将被放置在容器中，但在这里，如果我们有块，容器的目的是什么。

（在其他结果中，发现：https://teamtreehouse.com/community/div-containers-div-wrappers 没有回答我的问题，让我问自己包装器是什么，以及：https://developer.mozilla.org/en-US/docs/Web/CSS/All_About_The_Containing_Block 但这篇文章让我更加困惑）

我完全是初学者，如果我的问题对大多数人来说非常基本，我很抱歉，但我真的需要理解这个概念。谢谢谁帮忙！

【问题讨论】：

只是做更多的研究和阅读更多..顺便说一下你的问题在这里是题外话
您好，感谢您的回答。过去两天我一直在寻找答案，但我不需要阅读什么是什么。我需要了解其中的区别。为什么我的问题跑题了？有没有其他地方可以贴出来？
因为您的问题与编程问题无关......它与i need to learn more stuffs有关，因此即使您不想阅读也需要阅读更多内容，因为我们不阅读就无法学习
您好 Elly，欢迎来到 stackoverflow。很高兴你在这里。尽管您的问题对我来说似乎绝对合法，但我不得不承认@TemaniAfif 对他所说的部分正确。我重新阅读了您的阅读stackoverflow.com/help/how-to-ask，因为您的问题结构良好，所以我会尝试并尽可能好地回答您的问题:-)
我认为 CSS 概念的教学通常很差。大多数教程都有一种食谱风格，在试图获得更深入的理解时非常无益。本质上，CSS 是 boxes 的布局。块是一种遵循某些规则的盒子。一个容器代表一个盒子与另一个盒子的关系——container-of/contained-within。

标签： html css containers grid-layout

【解决方案1】：

正确理解技术术语的含义并使其适应上下文至关重要。 inline、block 和 inline-block 是 HTML 规范中定义明确的词。我不确定您到底指的是哪个container，因为从上下文中不清楚。你的意思是css-containers？

bootstrap 是一个框架，它本身不属于 HTML 规范。

freecodecamp 使用了很多框架，似乎很受欢迎，但他们没有专门的 stackoverflow 政策，相反，他们拥有自己的论坛。

在这方面，您的问题在这里是题外话，应该在这里发布： https://forum.freecodecamp.org/

他们甚至说

我们的论坛就像露营者的 Stack Overflow

希望我能提供帮助，当您了解有关 HTML、CSS 和 JavaScript 的更多信息并遇到您的第一个真正的“错误”时，请回到这里，我们会解决的 :-)

顺便说一句，我喜欢 w3schools：https://www.w3schools.com/html/html_blocks.asp

更具体一点：有些元素会有“自己的”行，这些是通常的块元素。然后是嵌入在当前行流中的内联元素。这里要注意的重要事实是：所有这些 HTML 元素都带有默认的 css 配置，您可以更改它！所以完全有可能通过指定不同的 css 使 div（默认为“块”元素）成为inline 元素。反之亦然，您可以通过覆盖它的默认 css 来使跨度表现得像 block 元素。 Firefox 控制台中的 CSS 窗格可以显示每个元素涉及的所有 CSS 规则。这意味着它不仅可以显示您定义的样式，还可以显示每个元素附带的默认样式。

尽管如此，了解block 的含义很重要，因为“新行”方法只是对正在发生的事情的简化。使用 HTML 元素似乎也是一个好主意，这不是最接近我想要的并改变它的行为。例如，如果它是右侧的广告，您将使用 div 并从那里开始，而不是说 span 并尝试将其弯曲到您的意愿（这完全有可能，但会导致有问题且不直观的代码）。

当我开始使用 HMTL 和 CSS 时，将 HTML 代码和呈现的网页并排处理非常有帮助。它极大地帮助了我的学习过程。我使用了 Dreamweaver（不确定它是否仍然存在），而现在您可能需要的只是 jsfiddle 和开发版 firefox（只是带有一堆扩展的常规 firefox，这使开发更容易）。过去我使用 Firebug，但现在每个主流浏览器都带有控制台、调试功能和实时代码编辑。只需在 Firefox 中按 F12 即可享受乐趣 :-)

【讨论】：

是的，我的意思是 css 容器。我检查了您发送的链接，并且我已经阅读了它。我的困惑就在这里：“
元素经常被用作其他 HTML 元素的容器。” “当与 CSS 一起使用时，
元素可用于设置内容块的样式”在其他网站上，它们有时可以互换使用“块”和“容器”，但它应该是不同的......我现在明白了稍微好一点，继续学习，所以我会到达那里！我会回来的，谢谢你的帮助！
我在答案中添加了一些（希望 :-) ）见解，如果您觉得它有帮助，请务必点击复选标记接受答案。