使用絕對位置

Question

下面的HTML代碼是我的HTML標記，我希望這個模板區域內的定位是絕對的。但是當我現在這樣做時，從左上角開始定位，但我希望位置（左：0，上：0）是課程表的左上角。

是否可以這樣做？

<div class="sheets" data-bind="foreach: pages"> 
    <div class="sheet"> 
     <div class="elements"> 
      <div data-bind="template: { name: 'image', foreach: Elements }"> 

      </div> 
     </div> 
    </div> 
</div> 

Answer 1

位置，你想讓它使用別的東西比static，通常relative被抵消<div>。在你的情況下：

.sheets { 
    position: relative; 
} 

應該做的伎倆。

編輯：也許我誤解了這個問題。將樣式應用於.sheet或.elements可能更合適。

Answer 2

要使父元素中的元素相對於父元素絕對定位（例如0,0是父元素的左上角），您需要通過將父元素設置爲position:relative;

如果你希望你的<div class="sheet">元素成爲新的定位方面則做到這一點：

.sheet 
{ 
    position:relative; 
} 

這將實現你想要的。

編輯：瞭解更多信息，請參閱這篇article on the differences between CSS positioning values和absolute positioning inside relative positioning

Answer 3

使用相對位置類板材和位置絕對爲它的孩子。

.sheet { 
position:relative; 
} 
.elements { 
position:absolute; 
top:0; 
left:0; 
}