4个回答
展开全部
使用style="float:left"样式就可以让两个DIV在同一行，如下例所示：
<!DOCTYPE html>
<head>
<title>Untitled</title>
</head>
<body>
<div style="float:left;width:100px;background:red;">第一个</div>
<div style="float:left;width:100px;background:green;">第二个</div>
</body>
</html>
效果如下：
css中float说明：
float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。
如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。
值 描述
left 元素向左浮动。
right 元素向右浮动。
none 默认值。元素不浮动，并会显示在其在文本中出现的位置。
inherit 规定应该从父元素继承 float 属性的值。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
.div1{border:1px solid red;width:100px;height:50px;float:left;margin-left:25%;position:relative;left:-80px}
.div2{border:1px solid red;width:60px;height:50px;float:left;position:relative;left:-80px}
</style>
</head>
<body style="text-align:center">
<div class="div1"></div>
<div class="div2"></div>
</body>
</html>
注意，以上css中最后的 "left:-80px" 80=(div1的宽度+div2的宽度)/2
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
.div1{border:1px solid red;width:100px;height:50px;float:left;margin-left:25%;position:relative;left:-80px}
.div2{border:1px solid red;width:60px;height:50px;float:left;position:relative;left:-80px}
</style>
</head>
<body style="text-align:center">
<div class="div1"></div>
<div class="div2"></div>
</body>
</html>
注意，以上css中最后的 "left:-80px" 80=(div1的宽度+div2的宽度)/2
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
把body的css属性改成居中就整个页面里的div都居中了。但是把div的css的float是left的时候不会居中了。所以可能把div的float设成left，成一行后再用边界(margin)上下左右设距离较合适吧。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这个问题对于我来说高深了。但是我很有兴趣看看到底是怎么回事！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
