cssz中的块级元素和行内块级元素的问题

第一,浮动的目的。最初时,浮动只能用于图像(某些浏览器还支持表的浮动),目的就是为了允许其他内容(如文本)“围绕”该图像。而后来的CSS允许浮动任何元素。第二,绝对定位与浮动的区别。绝对定位是将元素彻底从文档流删除,并相对于其包含块定位(包含块可能是文档中的另一个元素或者是初始包含块)...
cssz中的块级元素和行内块级元素的问题
其实你这个问题和我很早学这个css的一个问题一样。既然浮动元素脱离了文档流,为什么文字会停在浮动元素的周边而不是跟浮动元素重合呢?
第一,浮动的目的。最初时,浮动只能用于图像(某些浏览器还支持表的浮动),目的就是为了允许其他内容(如文本)“围绕”该图像。而后来的CSS允许浮动任何元素。
第二,绝对定位与浮动的区别。
绝对定位是将元素彻底从文档流删除,并相对于其包含块定位(包含块可能是文档中的另一个元素或者是初始包含块),元素原先在正常文档流中所占的空间会关闭,就好像该元素原来不存在一样,该元素再也不会影响其他元素的布局了。如果将元素A定位到左上角的话,元素B占据元素A之前的位置,与元素A重合在一起,并被元素A覆盖。CSS代码和效果图如下。

而浮动,会以某种方式将浮动元素从文档的正常流中删除,并把浮动元素向左边和右边浮动,不过它还是会影响布局,关于浮动的有许多规则,读者可自行阅读《CSS权威指南》一书,介绍地很详细。采用CSS的特有方式,浮动元素几乎“自成一派”,不过它们还是对文档的其余部分有影响。这种影响源自于这样一个事实:一个元素浮动时,其他内容会“环绕”该元素。如果将元素A向左浮动的话,CSS代码和效果图如下图所示。由此可见,浮动之后,文字跑到了元素A的右边,即实现了文字环绕浮动元素的功能(如果A不浮动的话,div是块级元素,不可能有两个div处在同一行)。

以上都是我自己所想,希望可以帮到初学者。如果有错误或者不妥的地方,也请高手指出,我定当改正,谢谢!!
2017-09-12
块就是div撒。行内麻。ul li麻 span 啊 font啊 table啊。2017-09-12
mengvlog 阅读 9 次 更新于 2025-07-20 09:30:36 我来答关注问题0
  •  宜美生活妙招 行内元素和块级元素的有哪些

    一、行内元素(内联元素)定义:行内元素也叫做内联元素,一般都是语义级别的基本元素。布局特点:行内元素不会从新行开始,它们只占据其包含的文本或内容所需的宽度。容纳内容:行内元素一般只能容纳文本或者其他内联元素,不能容纳块级元素。常见示例:常见的行内元素包括、、、等。二、块级元素 定义:...

  •  翡希信息咨询 行内元素和块级元素有哪些

    行内元素包括:span、a、img、em、strong等。块级元素包括:div、p、h1h6、ol、ul、li、table等。行内元素的主要特点: 不会独占一行:多个行内元素可以存在于同一行内,如文本内容一样。 宽度和高度由内容决定:不能通过设定宽高来改变元素大小。块级元素的主要特点: 会独占一行:块级元素在网页...

  •  深空见闻 请简述块级元素、行级元素区别

    常见元素:span、a、img(有些情况类似行级)等,其中img虽归为行内元素,但因内容可替换故表现特殊。另外,input元素比较特殊,它属于行内块级元素。转换关系:块级元素和行级元素可以通过CSS的display属性进行转换,例如将行级元素设置为display: block;可使其变为块级元素,反之亦然。

  •  阿暄生活 行内元素和块级元素的有哪些

    行内元素: 定义:一般都是语义级别的基本元素。 容纳内容:一般只能容纳文本或者其他内联元素。 布局方式:不会从新行开始,通常在一行内显示,直到一行排不下才会换到下一行。 样式调整:通过CSS控制,内联元素也可以变为块级元素。块级元素: 定义:一般都是从新行开始显示,它可以容纳行内元素和其他...

  •  翡希信息咨询 块级元素,行内元素 , 替换元素、 非替换元素分别有哪些?

    块级元素可以设置width、height属性,而行内元素设置这些属性通常无效(尽管在HTML5中,某些行内元素如、等可以设置这些属性,但它们的行为更像是替换元素)。块级元素可以设置margin和padding,而行内元素的水平方向(padding-left、padding-right、margin-left、margin-right)会产生边距效果,但竖直方向(pa...

檬味博客在线解答立即免费咨询

CSS相关话题

Copyright © 2023 WWW.MENGVLOG.COM - 檬味博客
返回顶部