溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇內容主要講解“css中怎么實現背景定位”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“css中怎么實現背景定位”吧!
1、單詞表示法，表示圖片與盒子背景區域進行對應方向的對齊。
水平方向可選單詞：left、center、right
垂直方向可選單詞：top、center、bottom
2、像素表示法，像素值區分正負，正數表示圖片針對盒子的原點向右、向下移動。
第一個屬性值：像素是幾，表示背景圖片左上角針對 border 以內的左上頂點水平方向位移的距離。
第二個屬性值：像素是幾，表示背景圖片左上角針對 border 以內的左上頂點垂直方向位移的距離。
注： 負數表示圖片針對盒子的原點向左、向上移動。
可以利用屬性值為負數，制作在小盒子中顯示大的背景圖的一部分。 使用 fireworks軟件量取尺寸，讀取數據。可用于精靈圖。
第一步：在設計圖中，使用切片工具制作一個想要顯示區域大小的切片，讓切片左上頂點位于想要加載的背景部分。
第二步：讀取屬性欄的切片數據，其中寬、高就是要加載的盒子的寬高，x 和 y 的數值表示移動的距離的絕對值，直接將數值加負號賦值給背景定位屬性。
3、百分比表示法，100%代表的數值。
水平方向，等價于盒子的border以內的背景區域寬度減去圖片的寬度。
垂直方向，等價于盒子的border以內的背景區域高度減去圖片的高度。
到此，相信大家對“css中怎么實現背景定位”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
