$('ul').width($(window).width());
$('ul').css({"margin-left":"auto","margin-right":"auto"});我想设置ul的宽度以实现ul能够水平居中显示,但不想讲ul宽度固定死,于是想到用js动态设置CSS样式,可是为什么以上代码并不能实现我想要的效果呢?
当我将代码改成:
$('ul').width($(window).width()-300);
$('ul').css({"margin-left":"auto","margin-right":"auto"});却能够实现居中.
例外单独设置CSS,将宽度设置成100% 却又不能实现居中,这是为何???
width: 100%; margin: 0 auto; 当width: 90%;时为何又可以居中了..????
要想margin有效，他的父元素的宽度一定要是个确定值，同二楼说的
ul水平居中，但是不希望ul宽度固定，可以将ul的样式设置成：display: inline-block;
然后将它的父容器的样式中：text-align: center;
这样ul的宽高是被内容撑开的（当然也可以自己设置）
可以使用CSS样式控制的效果，不要使用JS去控制。
display:block;
margin:auto;
ul是块级元素，如果你不设置width或者width为100%（而它的父元素也是块级的话，并且也没有设置width），等于它已经最大宽度了，你设置margin并不是没有效果，只是它已经占满屏幕了，虽然没有明显的效果，但是它确实也是居中了。
所以当你把width变短后（比如你说的-300或者width:90%），它的宽度不再是最大宽度，因此你看起来就有明显的效果了。
如果你不想设置ul的宽度的话，就可以把它设置能行内元素（可以是inline也可以是inline-block，反正这个盒子模型是行内盒子模型就行），然后设置居中的话，只需要在父级元素设置text-align:center即可。
至于用不用使用js，我觉的不用，使用css足够了，是不是这个意思？DEMO