【新手求教】为什么我的UL标签在DIV里面有浮动后塌陷呢?

墙头上乘凉 2016-11-25 11:01:08

为什么我的UL标签在DIV里面有浮动后塌陷呢?


代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试</title>
<style type="text/css">
.title{
margin: 0 auto;
width: 900px;
height: auto;
border: 1px solid #CCC;
}
.title p{
width: 200px;
/*height: 100px;*/
/*background-color: #AAA;*/
}
.title ul{
float: right;
}
.title li{
float: left;
margin-left: 20px;
}
</style>
</head>
<body>
<div class="title">
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br/>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<ul>
<li><a href="#" class="title-right-a">混合型</a></li>
<li><a href="#">股票型</a></li>
<li><a href="#">债券型</a></li>
</ul>
</div>
</body>
</html>
...全文
292 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
墙头上乘凉 2016-11-25
  • 打赏
  • 举报
回复
引用 1 楼 Return_false 的回复:
不要试图 靠挤的方式 来实现同排的布局显示 合理的就是 统一设置浮动,也就是 p 和 ul 同排的话,p也要浮动,浮动本身脱离文档流,如果考虑其他元素不影响布局,那么父级也要相应的清除浮动
谢谢指教
  • 打赏
  • 举报
回复
不要试图 靠挤的方式 来实现同排的布局显示 合理的就是 统一设置浮动,也就是 p 和 ul 同排的话,p也要浮动,浮动本身脱离文档流,如果考虑其他元素不影响布局,那么父级也要相应的清除浮动

61,112

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧