                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

浮动模型实现不了在同一行的一左一右

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>浮动模型</title>

<style type="text/css">

div{

border:2px red solid;

width:200px;

height:400px;

}

#div1{

float:letf;

}

#div2{

float:right;

}

</style>

</head>

<body>

<div id="div1">栏目1</div>

<div id="div2">栏目2</div>

</body>

</html>

小丑20

2016-09-11

源自：初识HTML(5)+CSS(3)-升级版 13-4

关注问题我要回答

879

操作

收起

6 回答

慕圣6089952 回答被采纳 +3 积分
2016-09-11

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>浮动模型</title>

<style type="text/css">

div{

border:2px red solid;

width:200px;

height:400px;

}

#div1{

float:letf;

display:inline-block;

}

#div2{

float:right;

}

</style>

</head>

<body>

<div id="div1">栏目1</div>

<div id="div2">栏目2</div>

</body>

</html>

0 回复有任何疑惑可以回复我~

慕粉1474438898
2016-10-21

因为你把写错了不是letf 应该是left

0 回复有任何疑惑可以回复我~

慕粉2035072466
2016-10-12

其实是你代码打错，

#div1{

float:letf;

}

改为

#div1{

float:left;

}

0 回复有任何疑惑可以回复我~

jidashen
2016-09-11

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>浮动模型</title>

<style type="text/css">

div{

border:2px red solid;

width:200px;

height:400px;

}

#div1{

float:left;

}

#div2{

float:right;

}

</style>

</head>

<body>

<div id="div1">栏目1</div>

<div id="div2">栏目2</div>

</body>

</html>

2 回复有任何疑惑可以回复我~

慕粉3941115
2016-09-11

把div1 div2宽度都改小就行，他俩的宽度超过了你设置的div宽度，一行就盛不下了。

1 回复有任何疑惑可以回复我~

#1

小丑20 提问者

div的width不是设置div1和div2的width吗？

2016-09-11 回复有任何疑惑可以回复我~

weibo_城市废墟里的蟑螂_0
2016-09-11

因为在div中的width的宽度过大，而模拟状态下width总值不够400px，所以就不能并排，你把它改成100px，就可以看到了

1 回复有任何疑惑可以回复我~

#1

小丑20 提问者

我改成了50px还是不行，但是如果在div{}中添加一条float:left;就可以了

2016-09-11 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

初识HTML(5)+CSS(3)-升级版

参与学习 1225793 人
解答问题 18234 个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

本课相似问答

4 回答浮动模型只能左右浮动吗？可不可以上下浮动，是不是设置浮动模型时不能设置盒模型的margin-bottom宽度

2 回答使用了浮动模型后，如何让下一个元素不浮动？

1 回答流动模型和浮动模型同时使用

3 回答浮动模型，单独设置一个

1 回答流动模型浮动模型层模型

搜索更多本课相关问答

浮动模型实现不了在同一行的一左一右

我要回答关注问题

意见反馈帮助中心 APP下载