Html CSS"；清楚：两者都是“；不起作用，元素一直站在对方一边

我在玩一些代码。但是，我有一个问题：

为什么

clear:
span
标记下的
命令无效

如果运行代码，可以看到
span
元素（用青色表示）与
div
元素位于同一行。我不明白为什么会这样。
我的意思是，我知道可以解决问题的变通方法，但我试图理解为什么它在这种特定情况下不起作用

谢谢！！！=）


span{
高度：50px；
宽度：75px；
显示：内联块；
背景：rgb（0，255，255）；
明确：两者皆有；
}
div{
高度：100px；
宽度：34%；/*ocupa 34%da tela*/
背景：绿黄色；
显示：块；
浮动：对；
明确：两者皆有；
}
p{
背景：rgb（225,11233）；
宽度：200px；
高度：100px；
明确：两者皆有；
}
你好

氧指数
Oi 2
Oi 3
你好
你好2
你好3
嗨

嗨2

嗨3

清除：两者都有仅与浮动的元素相关，而您的
span
则不是这种情况（这些跨度是内联块，但这是另一件事，
clear
对内联块没有影响）
嗨，也许使用一种clearfix方法？跨度没有浮动，因此在它们之后没有什么可清除的。使它们浮动，然后查看resultTry CSS网格或Flexbox。