当前位置: 海之晶网站设计> 建站知识> 网站建设>了解CSS布局和块格式上下文

了解CSS布局和块格式上下文

文章出处:网站建设-海之晶网络 | 网站编辑:网站设计 | 发表时间:2020/10/17 21:50:31
分享:

在CSS布局中有一些概念,一旦你理解了这些概念,就可以真正增强CSS游戏。本文是关于块格式上下文(BFC)的。你可能从未听说过这个词,但如果你曾经用CSS做过布局,你可能知道它是什么。理解什么是BFC,它为什么工作,以及如何创建一个BFC非常有用,可以帮助您理解CSS中布局的工作原理。

在本文中,我将通过您可能熟悉的示例来解释BFC是什么。然后,我将向您展示一个新的display值,只有当您了解了什么是BFC以及为什么需要它时才有意义。

什么是BFC?通过一个简单的浮点示例,块格式上下文(BFC)的行为最容易理解。在下面的示例中,我有一个框,其中包含一个已浮动到左侧的图像和一些文本。如果我们有大量的文本,它会环绕浮动图像,然后边框会环绕整个批次。

如果我删除了一些文本,那么图像周围就没有足够的文本了,因为浮动是从文档流中取出的,所以边框会上升并在图像下方延伸到文本的高度

关键字:
南京市汉中路1号国际金融中心9楼
建站热线:13815417591
免责声明: 本站部分内容来源于互联网,如果本站部分内容侵犯您的权益,请您告知,站长会立即处理。