css - 在CSS中显示:block vs clear:both有什么区别

标签 css

除了标题中的问题,我也反过来想知道display:inline和clear:none有什么区别?

编辑:我有预感这个问题会不受欢迎......让我详细说明。

两者似乎都涉及将元素放在自己的行上。 “display:inline”使元素内联流动,这让我觉得与“clear:none”的行为非常相似,它允许元素 float 在你旁边。

相反,如果你想要你的 div,也许是本例中的页脚 https://css-tricks.com/all-about-floats/ , 独立站立然后你可以说“clear:both”表示没有任何东西可以漂浮在你旁边。

但这种行为似乎与“display:block”非常相似。

因此我的问题是,这些行为或预期用途有何不同?

我敢肯定,到现在为止我在 CSS 方面完全是个业余爱好者,但在从事后端编程 15 年后,我正努力面对恐惧并学习它。我希望有人可以回答这个问题,而不是因为我试图学习新东西而对我投反对票......

最佳答案

display:block -> 将元素显示为 block 元素(如 <p> )

clear:both -> 左侧或右侧都不允许有 float 元素

block 级元素总是换行开始并占据可用的整个宽度(尽可能向左和向右拉伸(stretch))。

内联元素不会在新行开始,只会占据必要的宽度。

关于css - 在CSS中显示:block vs clear:both有什么区别,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32277753/

相关文章:

html - 我的媒体查询不起作用

javascript - 使用 HTML 在输入字段的末尾放置静态文本

javascript - 获取图像信息并在页面调整大小时显示在控制台中

javascript - 当用户点击按钮时弹出一个窗口

css - Bootstrap CSS 导航栏高度在 IE 和 FF 中很大,在 Chrome 中正确

css - 页眉和页脚 Css

javascript - jquery 对话框上的 z-index 在 iframe 中不起作用

html - 图像不会随着分辨率降低而缩小

html - 负边距在 IE9 中不起作用

css - 我无法编辑 drupal 模块,CSS 位置很难找到