1: floatSpecial layout characteristics that cause the specified element to break away from the ordinary document flow. It must be applied to block-level elements, which means floats do not apply to inline tags. When float is applied then this element will be designated as a block-level element. For example, after an inline element is set to float, you can set the width and height for it.
.clear:after{
content:" ";
display:block;
height:0;
clear:both;
visibility:hidden;
}: The after pseudo-element adds content after the element. This pseudo-element allows creators to insert generated content at the end of the element content. By default, this pseudo-element is an inline element, but this can be changed using the display attribute. The content generated by using after is a space. First display: block, and then set the height to 0 to prevent it from affecting the layout. Hiding is similar to height: 0 in that it does not affect the layout. clear: both means clearing float. For browsers ie6 and ie7 that do not support after, just add a height: 1%; and it will be ok. In this case, ie6 and ie7 will have haslayout.
2:haslayput
In fact, haslayout is an internal component of the rendering engine of Windows Internet Explorer 7 or below,
In Internet Explorer 7 and below, an element either calculates the size and organizes its own content, or relies on the parent element to calculate the size and organize the content. In order to reconcile these two different concepts, the rendering engine uses the hasLayout attribute, which can be true or false. When an element's hasLayout attribute value is true, we say that the element has a layout. When an element has a layout, it is responsible for sizing and positioning itself and possible descendant elements. Simply put, instead of relying on ancestor elements to do the job. IE can be viewed through the IE Developer Toolbar Next, whether the HTML element has haslayout, the element with haslayout is usually displayed as "haslayout = -1".
The has layout here is to calculate and position the size of itself and possible descendant elements to determine the height of the parent element. That is, the parent element adapts to the height of the content inside. This time everyone will understand why a height is added. :1% of the reason. Of course, you can also add other attributes to make it have layout, such as width, etc. Of course, you can add float (float can also trigger layout), but it is not recommended. Do not use float to clear the float, because float will generate another float.
,,
,