当前位置: 首页 > 网络应用技术

谈论浮动和BFC

时间:2023-03-08 14:36:04 网络应用技术

  浮动是网页的布局方法。尽管趋势已经过去了,但它也是布局中的绝佳方法。它意识到与单词相似的文本的纹理,如图1-1-1所示

  图片1-1

  清除浮动浮子的影响

  写作1:

  写作2:

  注意:写作2种类型,所以我不会一个人列出它们

  类似于溢出:隐藏;反浮动

  显示:表;可能会引起一些问题

  溢出:滚动;可能显示滚动条

  向左飘浮;可以将元素放在容器的左侧,其他元素包围

  溢出:隐藏;可能会切断溢出的元素

  原理:触发BFC框,BFC框如图3-1所示

  图3-1

  BFC框正式解释:在BFC中,每个盒子的左外侧框架都紧紧地框在块旁边(从右侧到左侧,位于右框架旁边)。即使有浮动(尽管盒子的框架会因漂浮而缩小),但是除非盒子创建新的BFC浮动,否则盒子本身会变得更狭窄。

  个人理解:溢出:隐藏的角色是隐藏过多的部分。如果浮子不占据正常流的位置,则将根据内容的含量高度切割普通流。计算了内部浮动元件的高度,它可能会切断浮子,这是反layout的常识。因此,当没有清晰的高度时,您需要计算所有高度以确定剪裁位置。目前,必须计算浮动高度,同时,清洁浮动的目标。

  包围文本时,建议使用浮子。当需要布局时,需要在需要同一行时使用该行的布局。使用浮子时,使用后立即使用清除效果。

  Clear的方法没有固定。未使用的写作习惯只是使用地点之间的区别。基本上可以保证在浮动后添加清晰。