相对定ä½çš„ç›’å­ä»€ä¹ˆæ—¶å€™å»ºç«‹ä¸€ä¸ªæ–°çš„包å«å—?

时间:2016-10-12 00:24:13

标签: html css css-position

在CSS2.2, 9.4.3 Relative positioning中,声明:

  

相对定ä½çš„ç›’å­ä¿æŒå…¶æ­£å¸¸çš„æµé‡å¤§å°ï¼ŒåŒ…括线   休æ¯å’Œæœ€åˆä¸ºå®ƒä¿ç•™çš„空间。关于   containing blocks解释了相对定ä½çš„ç›’å­ Â Â å»ºç«‹ä¸€ä¸ªæ–°çš„åŒ…å«å—。

containing blocks上的部分是:

  

在CSS 2.2中,计算了许多框ä½ç½®å’Œå¤§å°   到一个å为 包å«å— 的矩形框的边缘。在   通常,生æˆçš„框用作包å«åŽä»£çš„å— Â Â ç›’;我们说一个盒å­â€œå»ºç«‹â€å®ƒçš„包å«å—   åŽäººã€‚短语“一个包å«å—çš„ç›’å­â€æ„æ€æ˜¯â€œ   包å«ç›’å­æ‰€åœ¨çš„å—,“ä¸æ˜¯å®ƒç”Ÿæˆçš„å—。

     

æ¯ä¸ªæ–¹æ¡†éƒ½æœ‰ä¸€ä¸ªç›¸å¯¹äºŽå…¶åŒ…å«å—çš„ä½ç½®ï¼Œä½†æ˜¯   它ä¸å—这个包å«å—çš„é™åˆ¶;它å¯èƒ½overflow。

     

计算包å«å—尺寸的details   在next chapter中æ述。

我真的ä¸è¿™ä¹ˆæƒ³â€œè§£é‡Šä¸€ä¸ªç›¸å¯¹å®šä½çš„ç›’å­ä½•æ—¶å»ºç«‹ä¸€ä¸ªæ–°çš„包å«å—。â€

我的问题是:一个相对定ä½çš„ç›’å­æ˜¯å¦åªæœ‰å½“它有åŽä»£æ—¶æ‰ä¼šå»ºç«‹ä¸€ä¸ªæ–°çš„包å«å—,就åƒä¸ç›¸å¯¹å®šä½çš„ç›’å­ä¸€æ ·ï¼Ÿå¦‚果是这样,为什么在containing blocks?

的部分中添加对relative positioning的引用

1 个答案:

答案 0 :(得分:2)

一个区别是当相对定ä½çš„ç›’å­æ˜¯å†…è”ç›’å­æ—¶ã€‚内è”框通常ä¸æ˜¯åŒ…å«å—,因此,例如,具有display:inline;的元素的å­å…ƒç´ çš„浮动元素ä¸ä¼šç§»åŠ¨åˆ°å…¶çˆ¶å…ƒç´ çš„边缘,而是移动到其祖先元素的边缘确实建立了它的包å«å—。

但是相对定ä½çš„内è”框确实为其ç»å¯¹å®šä½çš„åŽä»£å»ºç«‹åŒ…å«å—。请å‚阅9.8.4 Absolute positioning

上的第二个和第三个示例