html 如何让几个div水平居中一行
发布网友
共10个回答
懂视网
html让div居中的方法是：可以用外边距margin属性来实现其居中。
HTML称为超文本标记语言，是一种标识性的语言。它包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。
超文本是一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中，也可能是其他文件，或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接，为人们查找，检索信息提供方便。
热心网友
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<body>标签中，输入html代码：<div style="float: left">123</div><div>456</div>。
3、浏览器运行index.html页面，此时多个div会水平居中在一行。
热心网友
使用浮动float即可实现，代码实例如下：
<html><meta charset="utf-8">
<body>
<style type="text/css">
.div1{width: 100px; height: 100; background: red; float: left;}
.div2{width: 100px; height: 100; background: yellow; float: left;}
.div3{width: 100px; height: 100; background: green; float: left;}
</style>
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
</body>
</html>
效果如下：
热心网友
用列表方式处理 设置div 的float属性;margin:o auto 可以达到居中效果
<div style="width:700px;margin:0 auto;">
<ul style="margin:0 auto;list-style:none;">
<li><div style="border:solid 1px white;height:50px;width:200px;background-color:lightblue;float:left;"></div></li>
<li><div style="border:solid 1px white;height:50px;width:200px;background-color:lightblue;float:left;"></div></li>
<li><div style="border:solid 1px white;height:50px;width:200px;background-color:lightblue;float:left;"></div></li>
</ul>
</div>
热心网友
外面的大div的样式div{margin:0 auto;}
里面几个小div,就用div1,div2,div3代替
如果想左中右
可以div1{float:left}
div2{float:left}
div3{ float:right}
热心网友
第一个，给每个div设置样式float：left；
第二个，给这些div的父类设置样式display:inline;
这样就可以了。
热心网友
把这个几个DIV，弄个父级，父级margin: 0 auto；然后让这几个DIV浮动就好了
热心网友
你对位置不熟悉，可以使用表格控制，让表格*即可。
热心网友
div {float:left}
外层容器给个width ,margin:auto
热心网友
float：left；
