Question

我想在鼠标悬停图片上显示标题 - 但在移动设备上，标题应位于图片下方。有任何想法吗？ http://jsfiddle.net/X8eCV/2/

@media (max-width:600px) {

#caption
{
display:block;
}

}
#caption {
 position:relative;
color:red;
    }
}

Answer 1

将position:relative添加到#image

@media screen and (max-width:600px) {
    #caption {
        position:relative;
        color:red;
    }

    #image {
        position:relative;
    }
}

http://jsfiddle.net/dvdyakonov/X8eCV/11/

Answer 2

你的意思是this一个：

@media (max-width:600px) {
    #caption {
        display:block; /* <-- */
        position:relative;
        color:red;
    }
}

好的，我会这样做：

http://jsfiddle.net/X8eCV/2/

Answer 3

http://jsfiddle.net/X8eCV/10/

  @media screen and (max-width:600px) {
#caption {
    position:relative;
 top:200px;
    color:red;
   }
  }

响应式CSS标题|鼠标悬停在图像上

3 个答案: