css中可以使用position屬性設定元素不隨捲軸滾動，語法「position:fixed」。 position屬性規定元素的定位類型，當值為fixed時，元素以相對瀏覽器視窗定位，無論如何移動滑動條，都會固定在瀏覽器視窗的相同位置。
本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。
在CSS中，可以使用固定定位（position:fixed;）來固定元素的位置，讓元素不隨捲軸滾動。
fixed 產生固定定位元素，元素脫離文件流，不佔據文件流的位置，可以理解為漂浮在文件流的上方，相對於瀏覽器視窗進行定位。
固定定位的元素以相對瀏覽器視窗為基準進行定位的，無論怎樣移動你的滑動條，它都會固定在相對於瀏覽器視窗的固定位置，另外要注意，它的兄弟元素將會在位置排布上忽略它的存在。這時候用的top，bottom，left，right也是相對於瀏覽器視窗而言的。
範例：
nbsp;html>
<meta>
<style>
.logo {
width: 540px;
height: 258px;
position: fixed;
background: url(猫/images/1.jpg) no-repeat;
margin: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
</style>
<div> </div>
布偶猫<br> 布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫
<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>布偶猫<br>
效果圖：
#從上面的範例看出：可以使用position: fixed來固定圖片位置不變，讓圖片位置可以不隨著文字的拖曳而改變圖片位置。
註：
在IE7以上版本及firefox、opera、safari裡，都支援css屬性"position:fixed"，它的作用就是將元素相對於視窗固定位置。
但在IE6下，並不支援position:fixed屬性，這個時候我們需要對IE6進行hack處理。
推薦學習：css影片教學
#以上是css如何實現元素不隨捲軸滾動的詳細內容。更多資訊請關注PHP中文網其他相關文章！
