如何解决CSS“明确:两者均不起作用”,元素始终保持彼此对立
为什么clear: both
标签下的span
命令不起作用?
如果运行代码,则可以看到span
元素(由青色表示)与div
元素在同一行。我不明白为什么会这样。
我的意思是,我知道可以解决该问题的解决方法,但是我想了解为什么在这种特定情况下它不起作用?
谢谢!!! =)
span{
height: 50px;
width: 75px;
display: inline-block;
background: rgb(0,255,255);
clear: both;
}
div{
height: 100px;
width: 34%; /*ocupa 34% da tela*/
background: greenyellow;
display: block;
float: right;
clear: both;
}
p{
background: rgb(225,11,233);
width: 200px;
height: 100px;
clear: both;
}
<section>Olá hello</section>
<hr>
<span> Oi</span>
<span> Oi 2</span>
<span> Oi 3</span>
<div> Hello</div>
<div> Hello 2 </div>
<div> Hello 3</div>
<p> Hi</p>
<p> Hi 2</p>
<p> Hi 3</p>
</body>
</html>
解决方法
clear: both;
仅与浮动元素相关,而span
则不是(那些跨度是内联块,但这是另一回事,clear
无效)在内联代码块上
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。