頂級元素相對於父

Question

底部的我有兩個div S：一個在另一個上面（我會打電話給前一個topDiv和底部的一個bottomDiv），他們每個人都有100％的width。他們在另一個div內部，稱爲parent。 parent充當虛擬/容器，其主要目的是幫助定位topDiv和bottomDiv。這些div中的每一個都使用絕對定位。 bottom有一個固定的高度，所以我有bottom css屬性topDiv設置爲這個高度。但是，我沒有top css屬性bottomDiv，因爲我認爲它將直接在topDiv下，但事實並非如此。

所有方向特性（top，right，bottom，left）是從他們的名字的方向上測量（例如top從頂部測量，因此，如果指定了類似5em，則該元件被放置5em的遠離它的容器的頂部），但是有沒有辦法扭轉效果？例如，爲right指定一個金額，該金額將導致該元素被放置在其容器的左側而非右側的指定金額。

Answer 1

由於top屬性定義從父母top的距離，然後用top:100%，這意味着「從父母的top的距離等於父母的height」，頂你設置你的元素，它的父母底部。現在

，如果你想獲得你的元素上，例如，從父母底部5像素，可以使用calc

.bottomDiv { 
    top:calc(100% + 5px); 
}