.div-inline{ display:inline}
Html代码片段：
<div class="div-inline">第一个div盒子</div><div class="div-inline">第二个盒子</div><div class="div-inline">第三个盒子</div>
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
* {
margin: 0
padding: 0
}
.menu {
font-family: tahoma, geneva, "lucida sans unicode", "lucida grande",verdana, sans-serif
margin: auto
width: 300px
}
ul {
list-style: none
text-align: center
}
a {
text-decoration: none
}
.menu>ul>li {
float: left
width: 60px
height: 30px
line-height: 30px
margin: 0 10px 0 10px
}
.menu>ul li>ul {
display: none
background-color: red
}
a,li {
cursor: pointer
}
.menu>ul li:hover {
background-color: #fd3
}
.menu>ul li:hover>ul {
display: block
}
</style>
</head>
<body>
<div class="menu">
<ul>
<li> <a href="#">
菜单一
</a>
<ul>
<li>子菜单1</li>
<li>子菜单2</li>
<li>子菜单3</li>
</ul>
</li>
<li> <a href="#">
菜单二
</a>
<ul>
<li>子菜单1</li>
<li>子菜单2</li>
<li>子菜单3</li>
</ul>
</li>
</ul>
</div>
</body>
</html>
