×

margintop不起作用

margintop不起作用(css代码里的margin为什么不起作用)

admin admin 发表于2023-11-06 12:37:53 浏览36 评论0

抢沙发发表评论

本文目录

css代码里的margin为什么不起作用

那是因为你的那个p元素前面的ul元素是float元素,所以p的margin-top实际上会是以ul前面的元素(如果存在,否则就会跟父元素的css属性来定位)的来定位。所以,要么你就让你的p也是float元素,要么就让p元素clear:left或者both,或者ul和p都不是float

子元素用margin-top 为什么反而作用在父元素上对使用margin-top 的元素本身不起作用

在这个说明中,“collapsing margins”(折叠margin)的意思是:2个或以上盒模型之间(关系可以是相邻或嵌套)相邻的margin属性(这之间不能有非空内容、padding区域、border边框或使用清除分离方法)结合表示为一个单独的margin。在css2.1中,水平的margin不会被折叠。垂直margin可能在一些盒模型中被折叠:1、在常规文档流中,2个或以上的块级盒模型相邻的垂直margin会被折叠。最终的margin值计算方法如下:a、全部都为正值,取最大者;b、不全是正值,则都取绝对值,然后用正值减去最大值;c、没有正值,则都取绝对值,然后用0减去最大值。注意:相邻的盒模型可能由DOM元素动态产生并没有相邻或继承关系。2、相邻的盒模型中,如果其中的一个是浮动的(floated),垂直margin不会被折叠,甚至一个浮动的盒模型和它的子元素之间也是这样。3、设置了overflow属性的元素和它的子元素之间的margin不会被折叠(overflow取值为visible除外)。4、设置了绝对定位(position:absolute)的盒模型,垂直margin不会被折叠,甚至和他们的子元素之间也是一样。5、设置了display:inline-block的元素,垂直margin不会被折叠,甚至和他们的子元素之间也是一样。6、如果一个盒模型的上下margin相邻,这时它的margin可能折叠覆盖(collapse through)它。在这种情况下,元素的位置(position)取决于它的相邻元素的margin是否被折叠。a、如果元素的margin和它的父元素的margin-top折叠在一起,盒模型border-top的边界定义和它的父元素相同。b、另外,任意元素的父元素不参与margin的折叠,或者说只有父元素的margin-bottom是参与计算的。如果元素的border-top非零,那么元素的border-top边界位置和原来一样。一个应用了清除操作的元素的margin-top绝不会和它的块级父元素的margin-bottom折叠。注意,那些已经被折叠覆盖的元素的位置对其他已经被折叠的元素的位置没有任何影响;只有在对这些元素的子元素定位时,border-top边界位置才是必需的。7、根元素的垂直margin不会被折叠。浮动的块级元素的margin-bottom总是与它后面的浮动块级兄弟元素(floated next in-flow block-level sibling)的margin-top相邻,除非那个同级元素使用了清除操作。浮动的块级元素的margin-top和它的第一个浮动块级子元素(floated first in-flow block-level child)的margin-top相邻(如果该元素没有border-top,没有padding-top,并且子元素没有使用清除操作)。浮动的块级元素的margin-bottom如果符合下列条件,那么它和它的最后一个浮动块级子元素的margin-bottom相邻(如果该元素没有指定padding-bottom或border):a、指定了height:autob、min-height小于元素的实际使用高度(height)c、max-height大于元素的实际使用高度(height)如果一个元素的min-height属性设置为0,那么它所拥有的margin是相邻的,并且它既没有border-top和border- bottom,也没有padding-top和padding-bottom,它的height属性可以是0或auto,它不能包含一个内联的盒模型 (line box),它所有的浮动子元素(如果有的话)的margin也都是相邻的。当一个元素拥有的margin折叠了,并且它使用了清除操作,那么它的margin-top会和紧随其后的兄弟元素的相邻margin折叠,但结果是它的margin将无法和其块级父元素的margin-bottom折叠。折叠操作是以padding、margin、border的值为基础的(即在浏览器解析所有这些值之后),折叠后的margin计算将覆盖已使用的不同margin的值。

css 为什么有时MARGIN 不起作用,

css有时MARGIN 不起作用是设置错误造成的,解决方法为:

1、新建一个HTML文件,命名为test.html。

2、为了测试出明显的效果,在test.html使用div定义了一个带边框的模块,里面放一个p标签。下面以p标签的外边距设置为例,详细讲解margin的使用。

3、使用margin设置p标签的左外边距。主要使用margin-left的方法定义左外边距的样式,值越大,距离左边就越大。

4、使用margin设置p标签的右外边距。主要使用margin-right的方法定义右外边距的样式,值越大,距离右边就越大。

5、使用margin设置p标签的上外边距。主要使用margin-top的方法定义上外边距的样式,值越大,距离上边就越大。

6、使用margin设置p标签的下外边距。主要使用margin-bottom的方法定义下外边距的样式,值越大,距离下边就越大。

为什么css里的margin-top 在浏览器不起作用呢 在dreamweaver里是起作用的急急求帮忙

地下朋友回答的行高我个人觉得也是可以用的,但是,在没有固定li的高度的时候,我比较喜欢用百分比来做!例如:line-height:180%如果不想用这类方法,margin不行,可以使用padding试试

CSS里的margin值不起作用

某些相邻的margin会发生合并,称之为margin折叠。

margin折叠常规认知:

  1. margin折叠只发生在块级元素上;

  2. 浮动元素的margin不与任何margin发生折叠;

  3. 设置了属性overflow且值不为visible的块级元素,将不与它的子元素发生margin折叠;

  4. 绝对定位元素的margin不与任何margin发生折叠;

  5. 根元素的margin不与其它任何margin发生折叠;

可以用padding替代。

a标签的margin-top无用

纠正下两个问题:1. 一楼说的不对,padding对内联元素也有效,添加display:block后对margin也有效。水平不行还敢做广告,鄙视下“sweetboy897”,再鄙视一下上海全鼎软件学院!2.LZ的问题和案例不符,是margin-top还是padding-top?这个其实是有效的,是肉眼上没看到效果,你试一下:在《a href=“#“》x《/a》之前加上《div style=“margin-top:1000px;“》《/div》,为了更方便看效果,不妨给《a》添加背景色#CCC,你再看一下有没有效?答案是:有效!对吧?如下:《!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN“ “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“》《html xmlns=“http://www.w3.org/1999/xhtml“》《head》《meta http-equiv=“Content-Type“ content=“text/html; charset=utf-8“ /》《title》abc《/title》《link type=“text/css“ rel=“stylesheet“ href=“t.css“ /》《/head》《body》《div style=“margin-top:1000px;“》《/div》《a href=“#“》x《/a》《/body》------------t.css中内容如下:@charset “utf-8“;/* CSS Document */a { background: #CCC; padding-top:1000px; }