无法弄清楚浮动的位置:左;在代码中

时间:2015-01-17 15:21:12

标签: html css

  

我在购物网站上放了很少的产品图片,现在我希望它们一个接一个地对齐。请帮我把浮动:左;正确通过代码属性。我使用了内联CSS。

 <div dir="ltr" style="text-align: left;" trbidi="on">

 <div>
 <div>
 <img src="http://3.bp.blogspot.com/-Oo0cN4TKxYY/VLpaQmWWYOI/AAAAAAAAAiE/HYEWlvr7Lrw/s1600/3-little-s-deluxe-gift-set-400x400-imae3r6szgnxh7wj.jpeg" 

 width="98px"/>
 </div>

 <div>
 <button onclick="myFunction()">Try it</button>
 <script type="text/javascript">
 function myFunction() {
 var btn = document.createElement("BUTTON");
 window.open("http://www.amazon.com/little-s-deluxe-gift-set/p/itmdapwqfgaczsrz?pid=BBCDAHZMPHRHVVYG&otracker=from-search&srno=t_5&query=baby+care&ref=9584cc4b-1511-454f-8ade-ec58babb4503","_self")
 }
  </script>
  </div>
  </div>








 <div>
 <div>
 <img src="http://1.bp.blogspot.com/-IlWU11ibyeg/VLpaQYbc8WI/AAAAAAAAAiI/Gnk7aEJbt9E/s1600/8-johnsons-baby-care-collection-400x400-imadngre8pbkrrsw.jpeg" height="98px" 

 width="98px"/>
 </div>

 <div>
 <button onclick="myFunction()">Try it</button>
 <script type="text/javascript">
 function myFunction() {
 var btn = document.createElement("BUTTON");
 window.open("http://www.amazon.com/johnsons-baby-care-collection/p/itmdnzg5zzugsnfm?pid=BBCDC2MZ95CZGEGG&otracker=from-search&srno=t_2&query=johnsons+baby+care&ref=9d0a902a-012a-4831-8379-40325f9b2da5
","_self")
  }
  </script>
  </div>
  </div>

1 个答案:

答案 0 :(得分:2)

我所做的就是将 style =“float:left”添加到两个父div中 - 在jFiddle上演示:http://jsfiddle.net/rfrap2dL/

 <div dir="ltr" style="text-align: left;" trbidi="on">

 <div style="float:left">
 <div>
 <img src="http://3.bp.blogspot.com/-Oo0cN4TKxYY/VLpaQmWWYOI/AAAAAAAAAiE/HYEWlvr7Lrw/s1600/3-little-s-deluxe-gift-set-400x400-imae3r6szgnxh7wj.jpeg" 

 width="98px"/>
 </div>

 <div>
 <button onclick="myFunction()">Try it</button>
 <script type="text/javascript">
 function myFunction() {
 var btn = document.createElement("BUTTON");
 window.open("http://www.amazon.com/little-s-deluxe-gift-set/p/itmdapwqfgaczsrz?pid=BBCDAHZMPHRHVVYG&otracker=from-search&srno=t_5&query=baby+care&ref=9584cc4b-1511-454f-8ade-ec58babb4503","_self")
 }
  </script>
  </div>
  </div>
 <div style="float:left">
 <div>
 <img src="http://1.bp.blogspot.com/-IlWU11ibyeg/VLpaQYbc8WI/AAAAAAAAAiI/Gnk7aEJbt9E/s1600/8-johnsons-baby-care-collection-400x400-imadngre8pbkrrsw.jpeg" height="98px" 

 width="98px"/>
 </div>

 <div>
 <button onclick="myFunction()">Try it</button>
 <script type="text/javascript">
 function myFunction() {
 var btn = document.createElement("BUTTON");
 window.open("http://www.amazon.com/johnsons-baby-care-collection/p/itmdnzg5zzugsnfm?pid=BBCDC2MZ95CZGEGG&otracker=from-search&srno=t_2&query=johnsons+baby+care&ref=9d0a902a-012a-4831-8379-40325f9b2da5
","_self")
  }
  </script>
  </div>
  </div>
<div style="clear:both"></div>