浮动

div、h1 或 p 元素常常被称为块级元素。这意味着这些元素显示为一块内容,即“块框”。与之相反,span 和 strong 等元素称为“行内元素”,这是因为它们的内容显示在行中,即“行内框”。

<div>

some text

<p>Some more text.</p>

</div>

在这种情况下,这个框称为无名块框,因为它不与专门定义的元素相关联。

CSS 有三种基本的定位机制:普通流、浮动和绝对定位。

static

元素框正常生成。块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中。

relative

元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。

absolute

元素框从文档流完全删除,并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。

fixed

元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。

浮动

浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,268评论 1 92
  • CSS定位/浮动——position/float CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布...
    pushyzheng阅读 357评论 0 0
  • 1.CSS position 属性 通过使用 position 属性,我们可以选择 4 种不同类型的定位,这会影响...
    黄花菜已凉阅读 384评论 0 0
  • 浮动 CSS允许浮动任何元素。 浮动元素 首先,会以某种方式将浮动元素从文档的正常流中删除,不过它还是会影响布局。...
    exialym阅读 1,331评论 0 6
  • 一 词汇 庭にわ院子 窓まど 窗户 屋根やね屋顶 カーテン 窗帘 ポスト 信箱エアコン 空调 が...
    咕噜轱辘前行阅读 175评论 0 0

友情链接更多精彩内容