CSS中有一個很有趣的概念，叫做堆疊。當元素們串在一起時，CSS會按一定的順序排列它們，在層疊的時候我們要注意這個順序。

div {
background-color: red;
color: white;
font-size: 30px;
z-index: 1;
}
p {
background-color: blue;
color: white;
font-size: 20px;
z-index: 3;
}

上面的例子中，我們給div和p都添加了背景顏色和文字顏色。但是我們給它們設置了不同的z-index，意味著一個元素的內容可以放在另一個元素的上面，覆蓋掉它的內容。

如果我們在這個例子中再添加一個h1元素，它的z-index為2：

h1 {
background-color: yellow;
color: black;
font-size: 40px;
z-index: 2;
}

那么在頁面上，元素的顯示順序就是h1在最前面，div在中間，p在后面。如果我們想要改變這個順序，就要調整它們的z-index。

心跳報文可以通過CSS里的動畫效果實現，它是指在一定時間范圍內元素的大小會不斷變化。在這個時候，我們要注意CSS堆疊的順序，避免出現元素覆蓋或者遮擋的情況。