barriers / 阅读 / 详情

css中,“margin:0 auto”和margin-top是冲突的吗?

2023-07-12 15:39:13
共7条回复
ardim

是的,margin:0 auto 里面包含可margin-top。

1、margin:0 auto;的意思是margin-top:0 margin-bottom:0;左右的值为auto,效果就是水平居中。

2、margin的值的问题

margin: 其为四个值时左右区域是:上-右-下-左

一个值时作用于四边

两个值时第一个作用于上下第二个作用于左右

三个值时 上 左右 下

LuckySXyd

css中,“margin:0 auto”和margin-top是冲突的吗?

:margin:15%;

这个百分比是以最大的长或高来计算的,

一个意思margin-top:15%=margin-right15%=marging-left:15%;

因为height为:100%;所以margin-bottom是无效的,

你算下1024(宽)>768高(1024X768分辨率),

1024X15%=153 margin-top=margin-bottom=margin-right=153明白滚动条的来由了吧,因为这时的hight就是768+153=921>768所以就有滚动条了

IE的盒子模型和firefox的盒子模型是不同的,详细可以看我的博客图片

因此margin的依据也就有所不同

其实IE也是支持w3c的标准模式的,只不过要在html文档中加一个DOCTYPE标签而已

IE中的水平居中是要在body中加入 text-align:center;的

而firefox只要求在要居中的元素加入 margin: 0 auto;

就会水平居中了(当然IE也要加)

要不出现滚动条就用 overflow:hidden; 就行了

希望我的回答对你有帮助

详细可以参考我的博客

熩嶙瑁佀乘桌刬倠状嘦朱浐澻朽佥

可可

冲突的,但是不影响。哪个写在后面就用哪个。

豆豆staR

当然冲突了!,你可以把margin分离的啊:按照

上右下左的顺时针方式去写:

margin:1px

2px

3px

4px;实际上就是

margin-top:1px;

margin-right:2px;

margin-bottom:3px;

margin-left:4px;

如果你好要居中的话就这样写:margin:1px

auto

3px

auto;

wpBeta

margin:0 auto;

其实就是margin-top:0; margin-right:auto;margin-botto:0;margin-left:auto;

margin:0 auto; 和margin-top同时声明的时候

相当于声明了2次margin-top。。在后面的那次会生效

nicehost

margin:o auto 的意思是: 上下间距0; 左右自动居中。所以是冲突的。

北境漫步

不冲突。和margin-left,margin-right冲突

相关推荐

css中margin-top和top有什么区别

margin-top 是上边界..距离一个标签,例如div,body的边框的上面的距离..top 是绝对定位...你自己找个网页设置下css.自己测试下就知道了....
2023-07-12 05:00:523

margin_top:40px;是什么意思

margin_top:40px。是代表上右下左(按顺时针)边距为40。Margin:包括margin-top,margin-right,margin-bottom,margin-left,控制块级元素之间的距离,它们是透明不可见的,对于Fig.2所示的上右下左margin值均为40px,因此代码为:margin-top:40px。margin-right:40px。margin-bottom:40px。margin-left:40px。根据上,右,下,左的顺时针规则,简写为margin:40px40px40px40px。当上下,左右margin值分别一致,可简写为:margin:40px40px。前一个40px代表上下margin值,后一个40px代表左右margin值.当上下左右margin值均一致,可简写为:margin:40px。
2023-07-12 05:01:061

css margin-top:5px; _ margin:3px ; 什么意思

margin-top:5px; 上外边距为5像素_ margin:3px; IE6浏览时外边距为3px(包括上、下、左、右) “_”写在属性前时,只有IE6可以执行到;
2023-07-12 05:01:162

CSS里border-top和margin-top什么意思?

border-top 是顶部边框~~margin-top 是顶部空白的宽度~~
2023-07-12 05:01:362

padding-top,margin-top和top的区别

padding-top:10px;是指容器内的内容距离容器的顶部有10个像素,是包含在容器内的;margin-top:10px;是指容器本身的顶部距离其他容器有10个像素,不包含在容器内;top:10px;是指容器本身的顶部距离页面的顶端有10个像素。
2023-07-12 05:01:471

给子盒子设置margin-top时,会作用于父盒子的解决办法

如何将子盒子垂直居中于父盒子?新手可能会想到使用margin, 但是子盒子设置margin-top后,会作用于父盒子,如图1 造成这个现象的原因是: 1.当一个元素包含在另一个元素中时(假设没有填充或边框将边界分隔开),它们的顶和/或底边界会发生叠加。 2.只有普通文档流中块框的垂直边界才会发生边界叠加。行内框、浮动框或绝对定位框之间的边界不会叠加。 解决办法如下? 方法一:为父元素设置border 方法二:为父元素添加overflow:hidden;样式 方法三:为父元素或者子元素声明浮动 方法四:为父元素或者子元素声明绝对定位
2023-07-12 05:01:541

margin-top:57px; 是什么意思

上面的外边距57px
2023-07-12 05:02:294

css中,“margin:0 auto”和margin-top是冲突的吗?

当然冲突了!,你可以把margin分离的啊:按照 上右下左的顺时针方式去写:margin:1px 2px 3px 4px;实际上就是margin-top:1px;margin-right:2px;margin-bottom:3px;margin-left:4px;如果你好要居中的话就这样写:margin:1px auto 3px auto;
2023-07-12 05:02:412

CSS中margin-top:-30px; 其中-30px表示什么意思!

如果是30px的话,表示距离上边界向下30px。-30px表示距离上边界向上30px。
2023-07-12 05:03:012

css中关于margin-top为负值,为什么没有上移。

原则上,行内元素(inline)是不能够设置宽高(width/height)、上下内边距(padding-top/padding-bottom)和上下外边距(margin-top/margin-bottom),因为同一行的所有行内元素在纵向的位置是一个整体,设置其中某个元素的上下边距,则整行都会跟随变化,当超出边框范围时(比如margin-top设为负值)则无效(除非行内的所有元素都设为同样的数值)。当然,行内块级元素(inline-block)是可以设置宽高(width/height)的,但在上下边距的问题上仍然遵循行内元素的原则。如果把display改为block,你会发现设为margin-top:-100px的box1立刻就上移了。
2023-07-12 05:03:101

css 怎么用margin-top属性设置段前为2行

line-height
2023-07-12 05:03:213

CSS的margin-top的负值问题

负值啊 就是这个标签会往负的方向跑呗
2023-07-12 05:03:313

在IE下用margin-top值很正常,在火狐下看margin-top值很大,怎么解决呢

.a2{width:300px;height:300px; position:relative;border:1px solid #ddd;margin-top:10px;margin-left:10px;} .b1{width:200px;height:200px;left:
2023-07-12 05:03:403

css中 *margin-top:中的*号什么意思 为什么不能写成margin-top:

css hacker写法,前面*是只有ie6.0和7.0能够识别,其他的浏览器是不认识的。如果是_margin-top就是只有ie6.0能够识别。一般情况下hacker写法针对ie浏览器,因为微软他的标准和国际标准不一致,不过他也正在逐渐的支持规范写法
2023-07-12 05:03:483

css中 margin-top 的负值是什么意思?其他的left/ right/ botttom 有负值吗?

margin-top距离上顶部多少可以有负值
2023-07-12 05:04:164

HTML网页编程的CSS中关于margin-top和margin-bottom的问题

浏览器的问题吧 ,用IE的话应该可以的,我试过了。但是用谷歌的就是你说的那样了..其他浏览器不晓得怎么样..
2023-07-12 05:04:285

margin-top为何不起作用,该怎么解决

因为span默认是行属性,而div默认是块属性,把span强制设为块属性就可以了。 u261e把这段 span{ margin-left:25px; margin-top:200px; } 改为 span{ margin-left:25px; margin-top:200px; display:block; }
2023-07-12 05:04:531

js控制style里的margin-top

margin-Top
2023-07-12 05:05:152

为什么css中设置了margin-top属性后,运行时背景图片会下移,如何更改?

给你的父级元素设置一个overflow: hidden;我看了很多的都没用 最后用这个解决的
2023-07-12 05:05:232

margin在html中什么意思

margin 是 CSS 语法,这个简写属性用于在一个声明中设置所有当前或者指定元素所有外边距的宽度,或者设置各边上外边距的宽度。块级元素的垂直相邻外边距会合并,而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地,浮动元素的外边距也不会合并。允许指定负的外边距值,不过使用时要小心。“margin”的语法结构:(1)margin:5px auto 意思上下为5,左右平均居中(2)margin-top: 20px 上外边距(3)margin-right: 30px 右外边距(4)margin-bottom: 30px 下外边距(5)margin-left: 20px 左外边距(6)margin:1px 四边统一边距(7)margin:1px 1px 上下边距,左右边距(8)margin:1px 1px 1px 上,左右,下边距(9)margin:1px 1px 1px 1px 上,右,下,左边距注释:允许使用负值。以上内容参考:百度百科-margin
2023-07-12 05:05:301

网页css代码的 margin:0 auto是什么意思

与上边间距为0像素,其它三边为auto自动.
2023-07-12 05:05:464

CSS中margin和padding的区别

一、padding1、语法结构(1)padding-left:10px; 左内边距(2)padding-right:10px; 右内边距(3)padding-top:10px; 上内边距(4)padding-bottom:10px; 下内边距(5)padding:10px; 四边统一内边距(6)padding:10px 20px; 上下、左右内边距(7)padding:10px 20px 30px; 上、左右、下内边距(8)padding:10px 20px 30px 40px; 上、右、下、左内边距 二、margin1、语法结构(1)margin-left:10px; 左外边距(2)margin-right:10px; 右外边距(3)margin-top:10px; 上外边距(4)margin-bottom:10px; 下外边距(5)margin:10px; 四边统一外边距(6)margin:10px 20px; 上下、左右外边距(7)margin:10px 20px 30px; 上、左右、下外边距(8)margin:10px 20px 30px 40px; 上、右、下、左外边距
2023-07-12 05:06:362

“CSS”中“margin:auto”是自动居中吗?

先看margin,margin有4个值:margin:10px 11px 9px 8px; ,按顺序分别代表对象与父容器的上、右、下、左的距离值为10px,11px,9px,8px。这还不能肯定是不是自动居中。如果只写两个值:margin:10px 5px; ,表示对象与父容器的上下距离值都是10px,与左右的距离值都是5px。这也不是自动居中。那么这时候我们来看margin:0 auto ,这个就表示上下的距离值是0,而左右就是自动适应,也就是我们常说的自动居中。合并后居中是Microsoft Office Excel软件的一项格式设置功能,即将选中的多个单元格合并,然后自动设置为居中格式。以Excel 2010软件为例设置合并后居中的方法如下:打开Excel2010工作表窗口,选中准备合并的单元格区域。在“开始”功能区的“对齐方式”分组中,单击“合并后居中”下拉三角按钮。在打开的下拉菜单中,选择“合并后居中”命令可以合并单元格同时设置为居中对齐;选择“跨越合并”命令可以对多行单元格进行同行合并;选择“合并单元格”命令仅仅合并单元格,对齐方式为默认;选择“取消单元格合并”命令可以取消当前已合并的单元格。
2023-07-12 05:06:462

怎么消除hover 对margin-top 的影响

你的hover是加在a上的,原有border是在li上的,.box1 li{border:#b7b7ff 1px solid; width:350px; height:350px;}变成.box1 a{border:#b7b7ff 1px solid; width:350px; height:350px;}或者.box1 a:hover{border:#99F 1px solid; position:absolute;}变成.box1 li:hover{border:#99F 1px solid; position:absolute;}
2023-07-12 05:07:001

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的方法定义下外边距的样式,值越大,距离下边就越大。
2023-07-12 05:07:211

在css中margin和padding作用是什么???

盒子外面用margin,内部用padding.
2023-07-12 05:08:266

CSS中margin和padding的区别

CSS中margin和padding有以下三方面区别。在CSS中margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离。在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离。1、语法结构。padding:padding-left:10px; 左内边距、padding-right:10px; 右内边距、padding-top:10px; 上内边距、padding-bottom:10px; 下内边距。margin:margin-left:10px; 左外边距、margin-right:10px; 右外边距、margin-top:10px; 上外边距、margin-bottom:10px; 下外边距。2、可能取的值。padding:length规定具体单位记的内边距长度、%基于父元素的宽度的内边距的长度、auto浏览器计算内边距、inherit 规定应该从父元素继承内边距。margin:length 规定具体单位记的外边距长度、%基于父元素的宽度的外边距的长度、auto浏览器计算外边距、inherit 规定应该从父元素继承外边距。3、浏览器兼容问题。padding:所有浏览器都支持padding属性、任何版本IE都不支持属性值“inherit”。margin:所有浏览器都支持margin属性、任何版本IE都不支持属性值“inherit”
2023-07-12 05:08:422

jquery 设置margin-top 刷新之后就失效了

属性值没有包起来
2023-07-12 05:09:062

div的margin-top

按照你的设置确实应该出现的效果是chrome中的,不要太相信DW中的设计效果,有些细微的设置在DW中根本无法体现出来
2023-07-12 05:09:142

为什么div里面的margin-top:120px;不起作用

关键词:空白间距叠加并不是任何bug只是css的一个特性有很多办法可以解决 比如 给父级元素添加border:1px solid transparent;或者 设置padding-top 或者绝对定位都可以解决
2023-07-12 05:09:212

inline-block;可以设置margin吗

我感觉应该不支持,看我右边的css,第一个.all .top .menu .nav-link代表我的a标签,我先对a标签设置inline-block,然后设置a标签的margin-left为25px,检查的时候发现,这句代码被划掉了,所以我感觉应该inline-block不支持设置margin;
2023-07-12 05:09:291

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

可以margin-top:100px !important;写。还可以成padding-top:30px;,效果都一样css样式是按照就近原则来执行的,margin-top:100px !important; 这个属性的意思是绝对执行这个,有可能你的别的地方也加上了 !important;
2023-07-12 05:09:466

javascript 如何获得padding 与margin

<div id=a style="padding:12px; margin:16px">12345</div><script>alert(document.getElementById("a").style.paddingLeft);alert(document.getElementById("a").style.marginLeft);</script>
2023-07-12 05:10:152

margin-top:-100px 和margin-left:-150px是什么意思

margin-top:-100px 的意思是顶部外边距是-100pxmargin-left:-150px 的意思是是左边外边距是-150px在显示效果上,您可以看到框体向左伸长150px 向上伸长100px哦~
2023-07-12 05:11:291

a标签的margin-top无用?

左边距,上边距
2023-07-12 05:11:424

margin属性又细分为哪些属性?

细分为 margin-top、margin-right、margin-bottom、margin-right,分别表示离上边、右边、下边、左边的距离
2023-07-12 05:12:011

html中都已经绝对定位,但是top:50%;不好使,left:50%好使,或者top:200px;也好使,求解答

好使啊,绝对定位是相对浏览器定位的,根据浏览器的高度的不同,你的50%的值也不一样,位置也不一样。200px直接就固定到距顶部200px的位置了
2023-07-12 05:12:142

网页设计中margin怎么用?

一、首先,我们先设计一个div,并且给这个div添加一个id,id名随意取。然后设置一下宽高,并且添加一个红色的背景属性值。默认情况下,这个div是靠近浏览器的顶部和左边的。二、接着我们给这个div设置一下margin值,从左到右表示的是上边,右边,下边,左边的margin值。设置好之后,可以看到左边和上边都隔开了一定的距离,这就是margin值的用处,而下边和右边因为没有其他div或者其他颜色,所以效果被忽略了。当然,margin值也可以分开写,比如我只设置div的上边的margin值,就可以使用margin-top,而右边则可以使用margin-right,左边则是margin-left,下边则是margin-bottom。三、设置margin-top之后,只有上边拉开了距离,而左边并没有拉开距离。接着我们再在网页中添加一个div,并设置id为“you”。接着设置“you”这个div的宽高和背景。四、新添加一个div之后,如果没有设置margin-bottom的值,两个div就会连在一起。然后我们给上面的div,也就是“my”,设置margin-bottom。设置好之后,两个div之间就会拉开距离,这样就可以定位好div的位置。五、如果我们给“my”设置好margin-bottom之后,又给“you”设置margin-top,又会有什么结果呢?结果就是这样:有两个相邻的div,如果一个div设置了margin-top,另一个设置了margin-bottom,则以它们之间值最大的为准。六、比如margin-top是50像素,margin-bottom是30像素,则间隔就是50像素,而不是两个相加哦。了解这个之后,在网页布局中,我们只需要对其中一个设置就可以了。
2023-07-12 05:12:241

正确的缩写为{margin:18px6px012px;}margin属性CSS样式,如遇到上下、左右、上下左右等情况我们可以缩写简写优化。在css中使用margin可以将margin-top,margin-right,margin-bottom,margin-left,缩写为一个标记,顺序为上右下左(顺时针)。1、只有上下情况缩写原始:margin-top:5px;margin-bottom:6px缩写简写为:margin:5px06px0或margin:5pxauto6pxauto2、只有左右情况缩写原始:margin-left:5px;margin-right:6px缩写简写为:margin:06px05px或margin:auto6pxauto5pxmargin:0auto;横向居中;margin:auto0;纵向居中;3、只有三边情况缩写原始:margin-top:5px;margin-bottom:6px;margin-left:4px缩写:margin:5px06px4px或margin:5pxauto6px4px4、四边相同值缩写原始:margin-top:5px;margin-bottom:5px;margin-left:5px;margin-right:5px缩写:margin:5px;5、四边不同值缩写原始:margin-top:5px;margin-bottom:6px;margin-left:7px;margin-right:8px缩写:margin:5px8px6px7px;6、四边其中上下值和左右值各相同缩写上下相同、左右相同原始:margin-top:5px;margin-bottom:5px;margin-left:7px;margin-right:7px缩写:margin:5px7px;
2023-07-12 05:12:371

为什么css中设置了margin-top属性后,运行时背景图片会下移,如何更改?

给你的父级元素设置一个overflow: hidden;我看了很多的都没用 最后用这个解决的
2023-07-12 05:12:472

CSS设置transition过渡margin-top后底下盒子跑上来了

transition 改变 margin 是会影响布局的,特别是你这种使用了 float 的布局,如果想不影响布局请用 transform: translateY(-5px),或者 translate3d(0,-5px,0) 来激活 GPU 加速
2023-07-12 05:12:572

margin-top:0.5em; em 是什么意思

em指字体高,任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。为了简化font-size的换算,需要在css中的body选择器中声明Font-size=62.5%,这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了。em有如下特点:1. em的值并不是固定的;2. em会继承父级元素的字体大小。重写步骤:1. body选择器中声明Font-size=62.5%;2. 将你的原来的px数值除以10,然后换上em作为单位;简 单吧,如果只需要以上两步就能解决问题的话,可能就没人用px了。经过以上两步,你会发现你的网站字体大得出乎想象。因为em的值不固定,又会继承父级元 素的大小,你可能会在content这个div里把字体大小设为1.2em, 也就是12px。然后你又把选择器p的字体大小也设为1.2em,但如果p属于content的子级的话,p的字体大小就不是12px,而是 1.2em=1.2 * 12px=14.4px。这是因为content的字体大小被设为1.2em,这个em值继承其父级元素body的大小,也就是16px * 62.5% * 1.2=12px, 而p作为其子级,em则继承content的字体高,也就是12px。所以p的1.2em就不再是12px,而是14.4px。3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明,也就是避免以上提到的1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em,那么在声明p的字体大小时就只能是1em,而不是1.2em, 因为此em非彼em,它因继承#content的字体高而变为了1em=12px。
2023-07-12 05:13:091

如何让div中的内容上下居中显示

如果是行内元素如标签或文本则使用line-height例:这是一行文本若果里面的标签是块级元素如div标签,则使用margin-topmargin-top的值是外div高度减去内div高度再除以2例这个div会水平、垂直居中显示
2023-07-12 05:13:192

〔html〕为什么这种情况span的margin-top会失灵?

如果只是为了margin-top生效,设置span的 display为inline-block,这样该span还是内联元素,如果只设置block,则变成了块级元素,看实际应用场景把
2023-07-12 05:13:432

js 怎么根据获取到的可用屏幕高度设置div的marginTop

$(function(){h=$(window).height();//获取浏览器窗口高度并赋值给h;这是jquery语句,需要先链接jquery插件})
2023-07-12 05:13:523

extjs 中ComboBox 下拉框 如何调整上边距margin-top 使它往下一点

bodyStyle : "padding:5", 换成 bodyPadding : 10,试试
2023-07-12 05:14:012

html为什么调整div层里面的标签的margin-bottom时没有反应,而可以调整margin-top属性,代码如下

有三个问题,一个是你的样式代码被注释了。二、你的li都是右浮动,就是在一排,margin-top当然有效,margin-bottom完全无用。三、topbig高度是50px,但是你的li的margin上下远远大于50px,这是错的
2023-07-12 05:14:091

div浮动后下面div的margin-top没法用了

不会有谁这样做布局的,,,如果你不加容器来做,,一整页下来,这么多div,必乱<div><div a></div><div b>这样就行了。
2023-07-12 05:14:193

是什么意思呀?

设置元素div的上外边距
2023-07-12 05:14:306

是什么意思?

CSS样式表中的字段,在网站程序中查找一.css为结尾的东西,打开在里面查找.container{....header{....Hleft{...里面的东西相当于<div style="...">style里的东西
2023-07-12 05:15:011