为了账号安全,请及时绑定邮箱和手机立即绑定

求解一个CSS的浮动问题

求解一个CSS的浮动问题

fruitchan 2015-03-31 11:41:07
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> .box {width: 200px;height: 200px;border: solid 1px red;} .l {float: left;} p{background: #73bcba;margin: 0;padding:0;} </style> </head> <body> <div class="box l"></div> <div class="box"><p>123</p></div> </body> </html>为什么在第一个div浮动之后,P的高度会增加而不是保持在原来相对第二个的位置?不是很理解~求指点
查看完整描述

3 回答

已采纳
?
uhelper_net

TA贡献37条经验 获得超9个赞

在现代浏览器和IE8+下,该元素会忽视浮动元素的而占据它的位置,并且元素会处在浮动元素的下层(并且无法通过z-index属性改变他们的层叠位置),但它的内部文字和其他行内元素都会环绕浮动元素。


查看完整回答
反对 回复 2015-04-14
?
赫兹1719

TA贡献3条经验 获得超1个赞

通常不要这样写代码,<p>在浮动布局中很容易带来一些问题

查看完整回答
反对 回复 2015-03-31
  • fruitchan
    fruitchan
    感谢回答,我知道代码不会这样写,但是就是想弄清楚为什么会这样。
  • 赫兹1719
    赫兹1719
    这里确实,折腾了半天,我也没弄明白
?
赫兹1719

TA贡献3条经验 获得超1个赞

这个应该是<p>元素是行内元素的缘故

查看完整回答
反对 回复 2015-03-31
  • 3 回答
  • 0 关注
  • 1541 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信