Fatal编程技术网
  • html/
  • Html 为什么<；字段集>；什么是透明浮标？

Html 为什么<；字段集>；什么是透明浮标？

html css forms

Html 为什么<；字段集>；什么是透明浮标？,html,css,forms,css-float,fieldset,Html,Css,Forms,Css Float,Fieldset,考虑以下测试用例，其中浮动元素和内联元素放置在中，而不是中： .float{float:right；背景色：红色；高度：200px；} 内联！ 浮动 内联！ 浮动 内联！ 浮动 内联！ 浮动 渲染时，字段集的高度为200像素（是否清除浮动？），而div的高度仅与内联元素相同。这种行为的原因是什么？是否存在允许字段集像div一样工作的变通方法？显然元素： 字段集元素将建立一个新的块格式上下文 我猜这与字段集作为可视表单控制组的性质有关。可能还有其他原因，但在我的脑海里，这听起来最有道理 似乎没

考虑以下测试用例，其中浮动元素和内联元素放置在
中，而不是
中：


.float{float:right；背景色：红色；高度：200px；}
内联！
浮动
内联！
浮动
内联！
浮动
内联！
浮动
渲染时，字段集的高度为200像素（是否清除浮动？），而div的高度仅与内联元素相同。这种行为的原因是什么？是否存在允许字段集像div一样工作的变通方法？

显然
元素：

字段集
元素将建立一个新的块格式上下文

我猜这与字段集作为可视表单控制组的性质有关。可能还有其他原因，但在我的脑海里，这听起来最有道理

似乎没有办法撤销这一点，但我不会感到惊讶；创建块格式上下文后，不能将其销毁

顺便说一句，
s不会清除浮动（除非您给它们一个
clear
样式，而不是
none
）。当一个元素清除浮动（或被称为有清除）时，它只清除在同一格式上下文中与它接触的前面的浮动。父元素也不会清除其子元素的浮动，但它可以为它们建立一个格式上下文。这是在
中看到的行为，也是在父元素上将
溢出设置为
可见之外的值时发生的情况

从（我的）重点：

此属性指示元素框的哪些边可能与先前的浮动框不相邻<强> >“清除”属性不考虑元素本身或其他< /强> 
中的浮动。

此外，如注释中所述，浏览器没有为该元素定义清除样式，因此默认清除样式已经是
none
的默认值。如图所示，只有浮动框后面的一个字段集被定义为具有清除属性，实际上是清除浮动的字段集。
设置包装器div的高度


 <html>
 <head>    
  <style type="text/css">       
   .float {float:right; background-color:red;             height:200px;}   
</style> 
 </head> 
 <body>    
 <fieldset>    
   <span>Inline!</span>    
   <div class="float">Float!</div>  
 </fieldset> 
 <fieldset>     
    <span>Inline!</span>      
   <div class="float">Float!</div>
 </fieldset> 

  <div style="height:200px">    
   <span>Inline!</span>     
  <div class="float">Float!</div> </div> 
 <div style="height:200px">     
 <span>Inline!</span>    
 <div class="float">Float!</div> 
</div>
</body>
</html> 




.float{float:right；背景色：红色；高度：200px；}
内联！
浮动
内联！
浮动
内联！
浮动
内联！
浮动

如果你不想让他们清除浮点数，试着给字段集一个
清除的样式：none
必须进入计算机才能看到Jared Farrish试图在小提琴中显示的内容。。。结果证明他只是在为OP演奏小提琴，而没有展示其他证据。@DA@imoda:我很确定字段集的默认清除样式已经是
清除：无
@BoltClock-我希望你没有太失望…：P@JaredFarrish：至少今天早上我不再固执地在iPhone上浏览了，所以谢谢：）我当然也找不出一个方法来做。最奇怪的是，只有在HTML5规范中，
fieldset
s才被定义为自己的BFC。它不在HTML4或CSS规范中……我想在某种程度上它是有意义的（而且我一直认为非清除div的东西是不可靠的），因为你会期望一个字段集在高度上包含所有的子元素。也许早期的规范没有包括它，因为浏览器制造商就是这样做的。谢谢你的澄清。事实上，这看起来确实像是“一直都是这样做的”：。看起来我将不得不寻找一种不同的方式来进行布局。我不认为您完全遵循Matt对字段集（而不是div）的要求。这是一种可以接受的方式，可以让div像字段集一样工作（我也可以使用现有的众多浮点清除方法之一），但我正在寻找一种解决方案，使字段集像div一样工作。