我不想将CSS添加到我的div元素中(例如<div style="text-align: center;">
)。
我只想将CSS代码添加到按钮元素中。
<div>
<button>Button</button>
</div>
在这种情况下,如何使按钮水平居中?
发布于 2013-03-09 01:54:59
button {
margin:0 auto;
display:block;
}
button {
margin: 0 auto;
display: block;
}
<div>
<button>Button</button>
</div>
发布于 2013-03-09 01:55:31
您需要在<button>
上使用display: block; margin: auto;
。jsFiddle
发布于 2013-03-09 02:03:43
其他人已经提到了margin: 0 auto;
方法,但是如果您需要解释,浏览器会在您的元素所在的任何容器中拆分可用的空间。
同样重要的是要指出的是,你可能需要给你的元素一个宽度,这是正确的工作。
所以,总而言之:
button {
display:inline-block; //Typically a button wouldn't need its own line
margin:0 auto;
width: 200px; //or whatever
}
https://stackoverflow.com/questions/15300234
复制相似问题