佈局不按計劃工作

我想爲我們公司的目錄放上一個很好的佈局，在左邊顯示員工照片，名稱，說明和MoreInfo鏈接堆疊在一起。佈局不按計劃工作

我使用的引導3.

我遇到的問題是，MoreInfo鏈接顯示的圖像下，而不是下面的描述，因爲我想要的。

下面是一個代碼示例：

<div class="row"> 
    <div class="col-md-6"> 

     <img src="images/1.jpg" alt="" style="margin-top:0; margin-right:15px;" class="pull-left"> 

     <div> 
     <h4 style="font-weight: bold; font-size:1.5em;">Zara Alipat, Ph.D.</h4> 
     <span> 
      Zara was born in western Niger, where the few girls who are lucky enough to attend school are pulled out at the age of 12 to get married. Despite the odds, Zara fought to complete her education and enter the professional workforce. Now she holds a Master’s degree, manages Mercy Corps’ human resources in Niger and uses her position to mentor other young people. 
     </span> 
     <p> 
      <a href="#">Read Full Bio</a> 
     </p> 
     </div> 

    </div> 

    <div class="col-md-6"> 

     <img src="images/1.jpg" alt="" style="margin-top:0; margin-right:15px;" class="pull-left"> 

     <div> 
     <h4 style="font-weight: bold; font-size:1.5em;">Zara Alipat, Ph.D.</h4> 
     <span> 
      Zara was born in western Niger, where the few girls who are lucky enough to attend school are pulled out at the age of 12 to get married. Despite the odds, Zara fought to complete her education and enter the professional workforce. Now she holds a Master’s degree, manages Mercy Corps’ human resources in Niger and uses her position to mentor other young people. 
     </span> 
     <p> 
      <a href="#">Read Full Bio</a> 
     </p> 
     </div> 

    </div> 


    </div>

任何建議，或良好的佈局爲這方面的例子是非常讚賞。

來源

2016-12-16 cnak2

<div class="col-md-6"> 
    <div class="row"> 
    <div class="col-sm-4"> 
     <img src="images/1.jpg" alt="" style="margin-top:0; margin-right:15px;" class="img-responsive"> 
    </div> 
    <div class="col-sm-8"> 
     <h4 style="font-weight: bold; font-size:1.5em;">Zara Alipat, Ph.D.</h4> 
     <span> 
      Zara was born in western Niger, where the few girls who are lucky enough to attend school are pulled out at the age of 12 to get married. Despite the odds, Zara fought to complete her education and enter the professional workforce. Now she holds a Master’s degree, manages Mercy Corps’ human resources in Niger and uses her position to mentor other young people. 
     </span> 
     <p> 
      <a href="#">Read Full Bio</a> 
     </p> 
    </div> 
    </div> 
</div>

嘗試在你的左右圖像的DIV使用附加的山坳通話。這樣你的項目就像列一樣行事，你的內容會相互尊重。我添加了一個額外的行包裝來照顧來自div上的col調用的填充。在裏面的列上播放數字以適應您的需求。我也對img調用進行了img-responsive，以確保它不會泄露該列。

來源

2016-12-16 19:30:43 jjeining

我也會在img上刪除您的保證金，因爲您的密碼填充將會照顧您正在嘗試執行的操作。 – jjeining

嘗試把圖像中的一個DIV的名稱和moreinfo在另一個使圖像格非浮動

style="float:none;"

來源

2016-12-16 18:04:12 Abdou

佈局不按計劃工作

回答

相關問題