为什么没有自举旋转木马内容相对于身体固定？

Question

这是一个示例，其中bootstrap轮播内的图像固定在top: 0位置。但是图像并没有固定在身体上：

img {
  position: fixed;
  top: 0px;
  }

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div>
  I am dummy content <br>
  I am dummy content <br>
  I am dummy content <br>
  I am dummy content <br>
  I am dummy content <br>
  I am dummy content <br>
</div>

<div id="myCarousel" class="carousel slide" data-ride="carousel">
 
 <div class="carousel-inner" role="listbox">
    <div class="item active">
      <img src="http://www.w3schools.com/bootstrap/img_flower.jpg" alt="Chania"/>
        <br/>
        <br>
        <br/>
        <br/>
        <br/>
        <br/>
        <br/>
        <br/><br/>
        <br/>
        <br/>
    </div>   
  </div> 
</div>

我的问题是为什么图像不能相对于身体定位？