CSS中,如果我們想讓一張圖片固定在某一位置,同時保持它與頁面右邊距離一定的距離,該怎么做呢?
img { position: fixed; right: 20px; /* 距離頁面右邊20像素 */ top: 50%; /* 頁面的中間位置 */ transform: translateY(-50%); /* 垂直居中 */ }
上述代碼實現了將圖片固定在頁面右側,并與頁面頂部垂直居中的效果,同時保持了與頁面右邊的距離。
其中,position: fixed
表示將圖片的定位方式設為固定定位,即相對于瀏覽器窗口的位置固定不動。
接著,right: 20px
表示將圖片與瀏覽器窗口右側保持20像素的距離。
top: 50%
將圖片位置設為距離頁面頂部的中間位置,接著使用transform: translateY(-50%)
將其垂直居中。
這樣,就可以將一張圖片固定在頁面上,并保持與右側的距離。
上一篇MYSQL數據庫類型的有
下一篇mysql數據庫類型轉換