2014-05-19 5 views
-2
<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <!-- Bootstrap --> 
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen"> 
    <link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet"> 
    <script src="http://code.jquery.com/jquery.js"></script> 
    <script src="bootstrap/js/bootstrap.min.js"></script> 
</head> 
<body> 
<div class="row"> 

<div class="span4"> 
Image:<img src="Tulips.jpg" ></img> 
</div> 
<div class="span4 "> 
<table class="table borderless"> 
<tr> 
<td><b>Test image</b></td> 
</tr> 

<tr> 
<td>testing testing</td> 
</tr> 
<tr> 
<td>120$</td> 
</tr> 
<tr> 
<td> 
<button class="btn btn-primary" type="button">Default button</button> 
</td> 
</tr> 
</table> 
</div> 

</div> 


</body> 
</html> 

Mon output1: enter image description hereréactivité div dans twitter bootstrap

et quand je teste pour sa réactivité en utilisant un téléphone mobile je reçois un sortie2 comme: enter image description here

Quelqu'un peut-il aidez-moi avec le code que j'ai posté pour le faire paraître comme output1 même pour la vue mobile ... merci ...

+0

j'utilise twitter-bootstrap ... je ne doivent écrire un fichier CSS. ... j'ai juste besoin de charger la classe que je dois appliquer le style ... et je suis nouveau à ceci ... ainsi j'ai posté le code j'ai essayé et ai demandé ce dont j'ai besoin ... – Tiffany

+0

emploient boostap3 au lieu de bs2 , le bs3 est mobile en premier, et vous n'avez pas besoin d'exemples de bootsrap-responsive.css: http://getbootstrap.com/ – wpdaniel

Répondre

0

J'ai eu la réponse:

<div class="row"> 
<table class="table borderless"> 
<tr> 
<td> 
<div class="span4"> 
Image:<img src="Tulips.jpg" ></img> 
</div> 
</td> 
<td> 
<div class="span4 "> 
<table class="table borderless"> 
<tr> 
<td><b>Test image</b></td> 
</tr> 

<tr> 
<td>testing testing</td> 
</tr> 
<tr> 
<td>120$</td> 
</tr> 
<tr> 
<td> 
<button class="btn btn-primary" type="button">Default button</button> 
</td> 
</tr> 
</table> 
</div> 
</td> 
</tr> 
</table> 
</div> 

Merci pour votre considération ..

0

Ici, vous allez:

<div class="row"> 
    <div class="col-xs-6">Image: 
     <img class="img-responsive" src="Tulips.jpg"></img> 
    </div> 
    <div class="col-xs-6 "> 
     <table class="table borderless"> 
      <tr> 
       <td><b>Test image</b> 

       </td> 
      </tr> 
      <tr> 
       <td>testing testing</td> 
      </tr> 
      <tr> 
       <td>120$</td> 
      </tr> 
      <tr> 
       <td> 
        <button class="btn btn-primary" type="button">Default button</button> 
       </td> 
      </tr> 
     </table> 
    </div> 
</div>