Question

基本上我已经在我正在制作的网站上放了一个画廊，而且效果很好。但。图片只是向下滚动屏幕的左侧。我想将其中一半的照片放在其他照片的右边......这是我网站的截图（用高科技红盒子绘制的颜色，以显示我希望一半的照片去哪里）< / p>

http://tinypic.com/view.php?pic=hx3fbb&s=8#.U2JPKYFdX-k

这是我的代码....（html）

          <div class="img">
             <a target="_blank" href="Gallery/Ss1.jpg">
   <img src="Gallery/Ss1.jpg" alt="Screenshot1" width="500" height="400">
  </a>
  <div class="desc">Death vs Colossus</div>
</div>
<div class="img">
  <a target="_blank" href="Gallery/Ss2.jpg">
  <img src="Gallery/Ss2.jpg" alt="Screenshot2" width="500" height="400">
  </a>
  <div class="desc">Death's forge</div>
</div>
<div class="img">
  <a target="_blank" href="Gallery/Ss3.jpg">
  <img src="Gallery/Ss3.jpg" alt="Screenshot3" width="500" height="400">
  </a>
  <div class="desc">Death vs Horseman</div>
</div>
<div class="img">
  <a target="_blank" href="Gallery/Ss4.jpg">
  <img src="Gallery/Ss4.jpg" alt="FanArt1" width="500" height="400">
  </a>


  <div class="desc">Horse Jump</div>
</div>
<p></p>
<div class="img">
  <a target="_blank" href="Gallery/fa1.jpg">
  <img src="Gallery/fa1.jpg" alt="FanArt1" width="500" height="400">
  </a>
  <div class="desc">Fan Art #1</div>
</div>
<div class="img">
  <a target="_blank" href="Gallery/fa2.jpg">
  <img src="Gallery/fa2.jpg" alt="FanArt2" width="500" height="400">
  </a>
  <div class="desc">Fan Art #2</div>
</div>
<div class="img">
  <a target="_blank" href="Gallery/fa3.jpg">
  <img src="Gallery/fa3.jpg" alt="FanArt3" width="500" height="400">
  </a>
  <div class="desc">Fan Art #3</div>
</div>
<div class="img1">
  <a target="_blank" href="Gallery/fa4.jpg">
  <img src="Gallery/fa4.jpg" alt="FanArt4" width="500" height="400">
  </a>
  <div class="desc">Fan Art #4</div>
</div>

这是我的CSS代码;

div.img
  {
  margin:5px;
  padding: 5px;
  border:1px solid #0000ff;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
  }
div.img img
  {
  display:inline;
  margin:5px;
  border:1px solid #ffffff;
  }
div.img a:hover img
  {
  border:1px solid #0000ff;
  }
div.desc
  {
  text-align:center;
  font-weight:normal;
  width:120px;
  margin:5px;
  }

所以再一次，我基本上会喜欢将Fan图片显示在截图图片右侧。我尝试为粉丝艺术创建一个新的div类，并将浮动更改为“正确的”＃39;但那没有用。

提前感谢您抽出时间并输入：）

Answer 1

您可以使用几种不同的方法。您可以使用浮点数或display: inline-block。

http://jsfiddle.net/Davidicus/p4Qkh/

这是一个简单的浮动示例。

我有一支笔，我使用“内联块”来浮动元素。单击css面板中的小眼图标以查看已编译的css。

http://codepen.io/davidicus/pen/vxIra

想在我的画廊中将照片彼此相邻（Html）

1 个答案: