<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>*{ pading:0px; margin:0px; border:double;}li{ list-style-type:none; float:left; width:200px; display:inline-block;}.classmate{ padding:20px;}.exteninfo{ clear:both;}ul{ padding:0px;}</style> </head><body><div class="classmates"> <div class="classmate"> <div class="baseinfo"> <ul> <li>姓名</li> <li>性别</li> <li>生日</li> <li>邮箱</li> <li>电话</li> <li>qq</li> </ul> </div> <div class="recommend"> <p>alkjshfgkahafo;alsksdfkhasdklfhasdjfkjasiuaebhgjlsdhg;hseikgh</p> </div> </div></div>
分别为ul和li设置高度，使ul能够包围li
ul{overflow:hidden;}
分别设置高度不是很灵活.解决方法我发现是使用dispaly:inline-block
overflow:hidden;加个这个就可以了
ul加个overflow:auto，或者让ul跟LI一样浮动起来。。或者是加固定的宽高
