2017-02-18 53 views
0

我有一個頁面,我想在圖像上顯示按鈕的一面,因此它看起來像圖像按鈕,所以作爲一個循環,暗示下載,但我是不擅長CSS,我嘗試瞭如下,但它不能解決我的要求。可以任何人調整我的代碼。提前感謝。如何讓圖像的按鈕一側

<section id="content" class="smPaddingTop60"> 
    <div class="content-wrap"> 
     <div class="container clearfix"> 
      <div class="nobottommargin"> 
       <div> 
        <div class="pressImg col-xs-12 col-sm-6 col-md-3"> 
         <img img-cache ng-src="images/press/launchad_winners.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
        </div> 
        <button class=" col-xs-12 col-sm-6 col-md-3 btn btn-success" data-ng-click="closePotentialModel()"> 
         <a target="_BLANK" href="https://app.hubspot.com/meetings/troy-martin"><span style="color:white;">Schedule a Meeting</span></a> 
        </button> 
        <hr> 
        <div class="imgContainer"> 
         <img img-cache class="image_fade mgnbtm" ng-src="images/press/logo.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
        </div> 
        <hr> 
        <div class="imgContainer"> 
         <img img-cache ng-src="images/press/xpertdox_logo_text.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
        </div> 
        <hr> 
        <div class="imgContainer"> 
         <img img-cache class="image_fade mgnbtm" ng-src="images/press/logo_text_blue.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

+0

您爲我們提供了字面上沒有CSS的。 – user6003859

+0

我沒有使用n =任何CSS我希望這些圖像一個接一個地作爲列表。 – striker

+0

如果你不想使用任何CSS,做一個列表的唯一方法就是實際製作一個列表(使用'ul'或'ol')。 – bfontaine

回答

0

也許這?

img.the-image-class + .the-button-class { 
    display: block; 
    margin-top: -20px; /* to move button 20px above from original position */ 
} 
0

output我認爲HTML沒有格式化好。

<section id="content" class="smPaddingTop60"> 
    <div class="content-wrap"> 
     <div class="container clearfix"> 
      <div class="row"> 
       <div class="pressImg col-xs-6 col-sm-6 col-md-6"> 
        <img img-cache ng-src="images/press/launchad_winners.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
       </div> 
       <div class="col-xs-6 col-sm-6 col-md-6 "> 
        <button class="btn btn-sm btn-success" data-ng-click="closePotentialModel()"> 
         <a target="_BLANK" href="https://app.hubspot.com/meetings/troy-martin"><span style="color:white;">Schedule a Meeting</span></a> 
        </button> 
       </div> 
      </div> 
      <hr /> 
      <div class="imgContainer"> 
       <img img-cache class="image_fade mgnbtm" ng-src="images/press/logo.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
      </div> 
      <hr /> 
      <div class="imgContainer"> 
       <img img-cache ng-src="images/press/xpertdox_logo_text.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
      </div> 
      <hr /> 
      <div class="imgContainer"> 
       <img img-cache class="image_fade mgnbtm" ng-src="images/press/logo_text_blue.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 
      </div> 
     </div> 
    </div> 
</section> 
0
May be like this, 

<section id="content" class="smPaddingTop60"> 
    <div class="content-wrap"> 
     <div class="container clearfix"> 
      <div class="nobottommargin"> 
       <div class="clearfix"> 
        <div class="pressImg col-xs-12 col-sm-6 col-md-3"> 
         <img img-cache ng-src="images/press/launchad_winners.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 

        </div> 
        <button class=" col-xs-12 col-sm-6 col-md-3 btn btn-success" data-ng-click="closePotentialModel()"> 
         <a target="_BLANK" href="https://app.hubspot.com/meetings/troy-martin"><span style="color:white;">Schedule a Meeting</span></a> 
        </button> 
        </div> 
        <hr> 
        <div class="imgContainer"> 
         <img img-cache class="image_fade mgnbtm" ng-src="images/press/logo.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners"> 

        </div> 
        <hr> 
        <div class="imgContainer"> 
         <img img-cache ng-src="images/press/xpertdox_logo_text.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners" > 
        </div> 
        <hr> 
        <div class="imgContainer"> 
         <img img-cache class="image_fade mgnbtm" ng-src="images/press/logo_text_blue.jpg" onError="this.src='images/noimage.png';" alt="launchpad_winners" > 
        </div> 




      </div> 
     </div> 
    </div> 
    </section> 
相關問題