如何在图像下方设置按钮？

如何设置下面的图片按钮？

这是我的CSS代码：

.news_img{ 
    margin:0 20 0 20; 
    float:left; 
} 
.trailer_button{ 
    z-index:999; 
    float:left; 
    margin:1 20 -20 20; 
    width:181px; 
    border-radius:10px; 
} 
.buttonimg{ 
    width:auto; 
    height:auto; 
}

.news_img是图像
.trailer_button是按钮
-buttonimg约为按钮，图像DIV

这是HTML

<div class="movie_box"> 
    <h3 class="h3">'.$movies['name'].'</h3>' 
    <div class="buttonimg"> 
     <div class="news_img"> 
      <img src="'.$movies['cover'].'"/> 
     </div> 
     <button class="trailer_button" type="button">Trailer</button>

来源

2015-02-06 Ivan Gorky

嗯，什么????目前还不清楚...... – 2015-02-06 18:00:15

请修改你的文章并添加你的HTML代码。 – showdev 2015-02-06 18:02:36

我想要设置这个拖车按钮下img – 2015-02-06 18:02:42

无论是<br/>铁道部Haviv的建议，或者只是删除浮动：

这里是一个正在运行的Example Fiddle

.news_img{ 
    margin:0 20 0 20; 

} 
.trailer_button{ 
    z-index:999; 

    margin:1 20 -20 20; 
    width:181px; 
    border-radius:10px; 
} 
.buttonimg{ 
    width:auto; 
    height:auto; 
}

来源

2015-02-06 18:09:02 Ted

这应该成为您的HTML代码：

<div class="movie_box"> 
    <h3 class="h3">'.$movies['name'].'</h3>' 
    <div class="buttonimg"> 
     <div class="news_img"> 
      <img src="'.$movies['cover'].'"/> 
      <br/> 
      <button class="trailer_button" type="button">Trailer</button>  
     </div> 
    </div> 
</div>

插入到图像DIV的按钮，并使用
创建一个新的行，就画面下，把鼠标。

的jsfiddle：http://jsfiddle.net/1a0mzqz0/

来源

2015-02-06 18:06:54 morha13

仍然没有... – 2015-02-06 18:08:16

@IvanGorky我加了jsFiddle。你可以看到它在那里工作得很好。 – morha13 2015-02-06 18:09:47

如何在图像下方设置按钮？

回答

相关问题