CSS怎么把塊固定在底部 要把一個(gè)塊固定在底部，我們可以使用CSS的position和bottom屬性。 比如我們有一個(gè)底部導(dǎo)航條，它位于頁(yè)面的底部，我們想讓它保持在底部。 我們可以在CSS中添加如下代碼： ``` CSS position: fixed; bottom: 0; ``` 這個(gè)代碼告訴瀏覽器，將這個(gè)元素的位置固定在屏幕的底部，并保持距離底部為0。 如果你想使一個(gè)塊在頁(yè)面中垂直居中，則可以使用如下CSS代碼： ``` CSS position: absolute; top: 50%; transform: translateY(-50%); ``` 這個(gè)代碼告訴瀏覽器，將這個(gè)元素的位置固定在父級(jí)容器的頂部，并使它垂直居中。其中，transform: translateY(-50%); 的作用是將塊向上移動(dòng)50%的高度，以便讓它垂直居中。 除了使用position和bottom屬性之外，我們還可以使用display:flex屬性將一個(gè)塊固定在底部，如下所示： ``` CSS display: flex; flex-direction: column; height: 100vh; justify-content: flex-end; ``` 這個(gè)代碼告訴瀏覽器，將這個(gè)元素的位置固定在容器的底部。其中，flex-direction: column; 的作用是讓塊垂直排列，height: 100vh; 的作用是將塊的高度設(shè)置為100%的視口高度，justify-content: flex-end; 的作用是將塊靠容器底部對(duì)齊。 通過(guò)使用以上CSS代碼，我們可以將一個(gè)塊固定在頁(yè)面底部或垂直居中。讓頁(yè)面變得更加美觀和易于閱讀。