Flexslider没有显示col的图像

-2

我试图用flexslider将图像和一些文字相邻，并且使用2 col-md-6。但由于某些原因，图像不被显示Flexslider没有显示col的图像

<div class="flexslider"> 
    <ul class="slides"> 
    <li> 
     <div class="col-md-6"> 
     <div class="avatar"> <img src="http://www.free-css.com/assets/files/free-css-templates/preview/page215/flosix/assets/images/intro-img1.jpg" alt="" class="img-responsive"> </div> 
     </div> 
     <div class="col-md-6"> 
     <blockquote> 
      <h1>We create Innovative Systems</h1> 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum.Interaction Designer at XYZCras mattis 
      consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
     </blockquote> 
     </div> 
    </li> 
    <li> 
     <div class="col-md-6"> 
     <div class="avatar"> <img src="http://www.free-css.com/assets/files/free-css-templates/preview/page215/flosix/assets/images/intro-img2.jpg" alt="" class="img-responsive"> </div> 
     </div> 
     <div class="col-md-6"> 
     <blockquote> 
      <h1>We create Digital Experience</h1> 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum.Interaction Designer at XYZCras mattis 
      consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
     </blockquote> 
     </div> 
    </li> 
    </ul> 
</div>

我不这样做，可能会改变形象的行为的任何CSS我只能选择其他HTML元素

来源

2017-10-10 Chris

请检查。我想你忘了把js。

$(window).load(function() { 
 
    $('.flexslider').flexslider({ 
 
    animation: "slide" 
 
    }); 
 
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.6.4/flexslider.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.6.4/jquery.flexslider-min.js"></script> 
 

 

 
<div class="flexslider"> 
 
    <ul class="slides"> 
 
    <li> 
 
     <div class="col-md-6"> 
 
     <div class="avatar"> <img src="http://www.free-css.com/assets/files/free-css-templates/preview/page215/flosix/assets/images/intro-img1.jpg" alt="" class="img-responsive"> </div> 
 
     </div> 
 
     <div class="col-md-6"> 
 
     <blockquote> 
 
      <h1>We create Innovative Systems</h1> 
 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum.Interaction Designer at XYZCras mattis 
 
      consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
 
     </blockquote> 
 
     </div> 
 
    </li> 
 
    <li> 
 
     <div class="col-md-6"> 
 
     <div class="avatar"> <img src="http://www.free-css.com/assets/files/free-css-templates/preview/page215/flosix/assets/images/intro-img2.jpg" alt="" class="img-responsive"> </div> 
 
     </div> 
 
     <div class="col-md-6"> 
 
     <blockquote> 
 
      <h1>We create Digital Experience</h1> 
 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum.Interaction Designer at XYZCras mattis 
 
      consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
 
      <p>Susan Sims, Interaction Designer at XYZCras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.Cras mattis consectetur purus sit amet fermentum. </p> 
 
     </blockquote> 
 
     </div> 
 
    </li> 
 
    </ul> 
 
</div>

来源

2017-10-10 09:40:24

Flexslider没有显示col的图像

回答

相关问题