css - CSS——浮动(有溢出)
问题描述
为什么溢出属性会影响以下示例中元素的布局方式。
我听说发生这种情况是因为当我们使用可见以外的值指定溢出时,它将清除浮动。我想知道我们是否可以使用 clear 属性(不使用溢出)重新创建行为。
我注意到的另一件事是:如果我没有指定溢出,但将其显示更改为内联块,它再次看起来不同。display: block 和 display: inline-block wrto 之前布局的浮动元素有什么区别?inline-block 是否也清除浮动?谢谢。
<html>
<head>
<title>Page Title</title>
<style>
section, aside, footer { border: 1px solid black;}
section {
width: 50%;
height: 50px;
float: left;
}
aside {
width: 30%;
height: 50px;
display: block;
overflow: hidden; /* comment this and see what happens */
}
footer {
width: 10%;
height: 50px;
}
</style>
</head>
<body>
<section>Section 1</section>
<aside>Aside</aside>
<footer>Footer</footer>
</body>
</html>
解决方案
推荐阅读
- angular - Native Script Angular 代码共享项目不创建节点模块目录,无法创建组件
- javascript - 在 setInterval 内创建一个精灵
- typescript - 输入'选择
' 不可分配给类型 'Partial ' 其中 TId 扩展了 keyof TTask - flutter - Flutter - 如果我添加了很多文本而不是它的长度,为什么我的文本会消失
- java - JDK 中已弃用的内容
- java - 使用Java中的OpenPDF居中/对齐表格单元格中的文本
- r - 如何重新排序一年中的某一天以使季节对齐
- linux - 在 0766 目录中创建文件失败
- firebase - 如何根据数组中的多个值过滤快照流?
- c# - C#中GPU上的碰撞检测