CSS的定位屬性非常有用，它可以幫助我們在網頁中精確地放置元素。其中，top定位可以讓我們在元素的頂部設置一個距離。使用百分比值作為top屬性的單位時，它是相對于元素的父級元素的高度來計算的。

.parent{
height: 500px;
position: relative;
}
.child{
position: absolute;
top: 20%; /*相對于.parent元素的高度，即100px*/
}

在上述代碼中，我們使用了一個relative定位的父元素，并且給它設置了一個高度。而子元素擁有absolute定位，它的top值設置為20%。這意味著子元素的頂部將會離父元素的頂部遠離其20%的高度，也就是父元素的100px。

需要注意的是，只有父元素擁有指定的高度值時，子元素的top百分比值才能生效。如果父元素的高度沒有被指定，那么子元素將無法相對定位，top值也無效。

另外，使用百分比方式定位元素時，需要保證這個元素以及其父級元素的高度值都已經指定，否則會帶來不可預料的布局問題。

總的來說，css top定位屬性中的百分比值可以讓我們更精確地控制元素的位置，而它所使用的相對單位可以確保網頁的響應式布局。在使用時要注意父元素高度的指定，以及避免出現布局問題。