Shulou(Shulou.com)06/01 Report--

This article mainly introduces the css floating example analysis, has a certain reference value, interested friends can refer to, I hope you can learn a lot after reading this article, the following let the editor take you to understand it.

The floating frame moves slightly to the left or right until its outer edge touches the frame of the enveloping box or another floating box.

Because the floater is not in the normal flow of the document, the block box in the trivial flow of the document behaves as if the floater does not have an anomaly.

CSS float

Take a look at the following figure. When Box 1 floats to the right, it leaves the document flow and moves to the right until its right edge touches the left edge of the sweep box:

Take a look at the following figure. When Box 1 floats to the left, it comes to the document flow and moves to the left until its left edge meets the left edge of the bounding box. Because it is no longer in the document stream, it does not capture space, theoretically blocking box 2 and making it disappear from the view.

Suppose you move all three boxes to the left, the last box 1 floats to the left until it touches the enclosing box, and the other two boxes float to the left until the previous floating box is encountered.

Thank you for reading this article carefully. I hope the article "sample Analysis of css floating" shared by the editor will be helpful to you. At the same time, I also hope that you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.