html中 float、position定位问题

html中 float、position定位问题,第1张

float是浮动,如果设置小盒子浮动,小盒子浮动的距离是根据小盒子前一个浮动兄弟元素的位置浮动的。所以一般大盒子里面的小盒子要么都浮动,要么都不浮动。

postiton是定位,有absolute和relative,fixed。一个定位的元素一定是被其他元素层层包起来的,至少是body包起来。absolute是根据包起来的定位元素定位的,如果包他的元素都没设置position,那就根据body定位。relative是相对定位,相对于包起它的元素定位的。fixed是根据屏幕定位的。

一般用absolute的话,都把包这个小盒子的大盒子设置为relative。这样小盒子的absolute会根据包它的大盒子绝对定位。

给里面盒子一个宽度然后通过margin:auto让他居中

举例

<div style="float:leftwidth:50%">第一个盒子(左)

<div style="width:50pxheight:30pxmargin:auto">里面的盒子</div>

</div>

<div style="float:rightwidth:50%">第二个盒子(右)</div>


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/6094521.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-14
下一篇 2023-03-14

发表评论

登录后才能评论

评论列表(0条)

保存