div 居中(div居中对齐的css代码)

如何使用CSS使DIV显示居中,以及有哪些CSS样式可以使div水平居中?
需要两个主要的CSS代码,一个是text-align:center(内容居中),另一个是margin:0auto;这两种样式需要一起使用才能实现div框的中心显示和布局。
首先,我们为主体设置text-align:center,然后为需要居中的div框设置css样式margin:0auto,以使相应的div可以水平居中。
该示例说明了div居中代码的应用。为了观察div居中效果,我们为div设置了一个名为“.div”的div,在html的div标签中使用class=“div”,将其宽度设置为400px;高度为100像素,边框为红色。这样我们就可以观察到效果了。

div

div居中对齐的css代码

1、div居中对齐条件与方法
只需要对要居中对齐的div样式加margin:0auto,不再需要加float样式。
因为float没有居中的浮动,所以我们需要去掉float样式,为了兼容各大浏览器让div居中对齐,我们需要对div对应样式加margin:0auto即可。

div软件

2、css+div布局完整HTML源代码:
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title>div对齐实例在线演示DIVCSS5</title>
<style>
.divcss5-cent{margin:0auto;width:250px;height:50px;border:1pxsolid#F00}
</style>
</head>
<body>
<divclass="divcss5-cent">此DIV居中右对齐显示</div>
</body>
</html>

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注