html - 关于如何在 CSS 中应用 clear 属性的困惑

Question

我正在学习一个教程，并且我有一个使用 float 元素的表单。表单当前的所有标签和输入框都彼此相邻。

要对齐表格，使所有内容都在左侧，书上教我:

放-> clear: left;如下

label {
  float: left;
  width: 5em;
  text-align: right;
  margin-right: .5em;
  **clear: left;**
}
input {
  background-color: #CCCCFF;
  float: left;
  clear: right;

我对 clear 属性的理解是，如果我将它设置在 float 元素上，则意味着我不想要该元素的左侧/右侧/两者。

因此，在我看来，与其将 clear 属性放在标签上，不如将 clear:right; 放在输入上也应该可行(因为这样一来，右边就没有任何内容了)输入框)，但当然不是。

我的理解存在差距，有人可以指出为什么将 clear:right 属性放在输入上与将 clear:left 属性放在标签上效果不一样吗？

谢谢

Answer 1

基本上 clear 属性会覆盖 float 。

我准备了这个例子:http://jsfiddle.net/vlrprbttst/JF7wD/1/

所有 div 都向左浮动。当应用 float 时，它们会彼此相邻。如果您需要暂时阻止此行为但仍需要 float 元素怎么办？那就是你使用 clear

的时候

这不是最好的解释方式，但我希望你明白了:)