CSS中,我們可以使用相對定位(relative positioning)或者***定位(absolute positioning)來實(shí)現(xiàn)文字在右下角的顯示。
相對定位是相對于元素在文檔流中的原始位置進(jìn)行定位,而***定位則是相對于瀏覽器窗口進(jìn)行定位。
下面是一個(gè)使用相對定位的例子:
HTML代碼:
<div style="position:relative;"> <p style="position:absolute; right:0; bottom:0;">這是顯示在右下角的文字</p> </div>
在這個(gè)例子中,div
元素是相對定位的,p
元素是***定位的。right:0
和bottom:0
屬性將p
元素的右上角與div
元素的右下角對齊。
你也可以使用***定位來實(shí)現(xiàn)同樣的效果:
HTML代碼:
<div style="position:absolute; right:0; bottom:0;">這是顯示在右下角的文字</div>
在這個(gè)例子中,div
元素是***定位的,它的位置相對于瀏覽器窗口的右下角,你可以根據(jù)需要調(diào)整div
元素的大小和樣式。
使用***定位時(shí),元素的位置不會(huì)隨著頁面滾動(dòng)而滾動(dòng),如果你需要讓元素在頁面中滾動(dòng)時(shí)仍然保持在右下角,那么你應(yīng)該使用相對定位。