怎么div排成一排,并实现自动换行
在一个html中怎么把几个大大小相同的div标签排成一行,并且如果到了页面最右端可以实现自动换行。(是div自动换行,不是div内的文字自动换行) --------------------编程问答-------------------- 用css,外层包一个DIV,其中有多个div,内层的div浮动属性设置成左浮动(看自己需求),外层的div宽度限定好,超出这个宽度会自动换行的 --------------------编程问答-------------------- css中又一个属性浮动,添加float:left可以将div排成一行。 --------------------编程问答--------------------+1 --------------------编程问答-------------------- 首先 这些div是同辈元素并且固定框度 在他们的父辈元素上固定宽度
然后在这些div上设置float=left --------------------编程问答--------------------
--------------------编程问答-------------------- 规定里面DIV的width,folat:left; --------------------编程问答-------------------- 这一类div加个class比如说 inline-div 则
<html>
<head>
<title>CCCCSDN</title>
<style>
div{width:100px; border:1px solid red; float:left; margin:2px;text-align:center}
</style>
</head>
<body>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
<div>1</div>
</body>
</html>
--------------------编程问答-------------------- 上面那个是一行五个,我小学数学没学好 --------------------编程问答-------------------- 2楼正解~~
.inline-div {
display: inline-block;
width: 19%; /*一行4个*/
margin: auto;
}
--------------------编程问答-------------------- 可以用 SPAN 代替 DIV,最外面用一个DIV包上 --------------------编程问答-------------------- 1楼2楼5楼 --------------------编程问答-------------------- 楼主以后这样的问题就不要问了,直接查CSS吧。先把基本的样式熟悉下。
补充:Java , Web 开发