Ich bin schon lange mit Float vertraut. Lassen Sie uns mit einer kleinen Demo darüber sprechen.
1: Unter der Annahme, dass es zwei p im Seitenlayout gibt, besteht die Anforderung darin, dass sich die beiden p in derselben Zeile befinden. Eine der Lösungen ist die Verwendung von float,
z. B.:
<li style="border-top: 1px #CCCCCC dashed;border-bottom: 1px #CCCCCC dashed;"> <p class="g-position_a">职位简介</p> <p class="g-position_b"> <dl class="g-position_list fl"> <dd>职位名称:php工程师</dd> <dd>工作经验:1-3年</dd> <dd>招聘人数:10人</dd> <dd>最低学历:不限</dd> </dl> <dl class="g-position_list fr"> <dd>月薪:3000-5000元(个税计算)</dd> <dd>年龄:不限</dd> </dl> </p> </li> <p class="box" style="width:300px;height:300px;></p>
2: Der obige Code ist darauf zurückzuführen, dass die beiden ps in li nach links und rechts (heraus) schweben des Dokumentflusses), li Es gibt keine „Seitenanzeige“-Höhe, daher überlappen sich die oberen und unteren Ränder von li, und
p mit dem Klassennamenfeld nach li wird angezeigt
Die aktuelle Lösung besteht darin, ein p hinzuzufügen, das das schwebende p nach seinen beiden schwebenden Unter-p entfernt. Zu diesem Zeitpunkt wird die Höhe von li aufgrund der „internen Elementerweiterung“ erneut auf der Seite angezeigt 🎜>
zB:
<li> <p class="g-position_a">职位简介</p> <p class="g-position_b"> <dl class="g-position_list"> <dd>职位名称:php工程师</dd> <dd>工作经验:1-3年</dd> <dd>招聘人数:10人</dd> <dd>最低学历:不限</dd> </dl> <dl class="g-position_list"> <dd>月薪:3000-5000元(个税计算)</dd> <dd>年龄:不限</dd> </dl> </p> <p class="clearfix"></p> </li>