【css问题】父类的浮动是否对子类的li具有作用

在做案例的时候遇到了问题
html部分

    <!-- 推荐模块 开始 -->
    <div class="w recom">
        <div class="recom_hd">
            <img src="images/图层106.png" alt="">
            <p>今日推荐</p>
        </div>
        <div class="recom_bd">
            <ul>
                <li><img src="upload/recom_03.png" alt=""></li>
            </ul>
        </div>
    </div>
    <!-- 推荐模块 结束 -->

CSS部分

.recom_bd {
    float: left;
}
.recom_bd ul li {
    float: left;
}

发现.recom_bd的浮动会导致第一个li产生浮动无论对li添加左浮动还是右浮动，第一个li仍以.recom_bd的浮动为标准
只是想问一下这么想对不对，能解答一下原因更好谢谢

不管如何，你可以加上一个清除浮动的div style="clear:both"。作为预防性的措施。

错误,
对标签添加浮动会使得标签脱离标准文档流,变成行内块级标签,你之所以无论对Li添加左浮动还是右浮动都以.recom__bd的浮动为标准就是因为这个原因,
额,因为li的父级是浮动的,所以li的浮动范围不会超出li父级盒子的边界,所以你要想看到li的浮动效果,就需要给它父级变得比他大,

你自己看代码吧

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
    .recom_bd {
    float: right;
        height:1000px;
        width: 1000px;
}
.recom_bd >div {
    float: left;
}
    </style>
</head>

<body>
<!-- 推荐模块 开始 -->
    <div class="w recom">
        <div class="recom_hd">
            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598506253878&di=618a6581a37c68c81c00d9125c7bd599&imgtype=0&src=http%3A%2F%2Fpic1.16pic.com%2F00%2F52%2F29%2F16pic_5229276_b.jpg" height="100" width="100" alt="">
            <p>今日推荐</p>
        </div>
        <div class="recom_bd">
            <ul>
                <li><img src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=255676174,1347478056&fm=26&gp=0.jpg" height="100" width="100" alt=""></li>
            </ul>


        </div>
    </div>
    <!-- 推荐模块 结束 -->
</body>
</html>

效果如下
图片说明