At this point the UL display interface is:
① to UL plus a style, display:inline-block;
<HTML><Head><title>Float</title><style>ul{Display:Inline-block;Border:1px solid #000; }ul Li{Border:1px solid #f00;float: Left; }</style></Head><Body><ul><Li>11</Li><Li>22</Li><Li>33</Li></ul></Body></HTML>
Program:
② to UL plus style, Float:left
<HTML><Head><title>Float</title><style>ul{float: Left;Border:1px solid #000; }ul Li{Border:1px solid #f00;float: Left; }</style></Head><Body><ul><Li>11</Li><Li>22</Li><Li>33</Li></ul></Body></HTML>
Program Run Result:
③ to UL plus style, Overflow:hidden;
<HTML><Head><title>Float</title><style>ul{Overflow:Hidden;Border:1px solid #000; }ul Li{Border:1px solid #f00;float: Left; }</style></Head><Body><ul><Li>11</Li><Li>22</Li><Li>33</Li></ul></Body></HTML>
Program Run Result:
Temporarily first put out the solution, after I have done a good study to carefully analyze it.
UL under the Li Float, how is ul has the height of Li