小编use*_*682的帖子

无法在CSS中并排显示图像组(类图像)

我已经尝试了一些东西,但没有运气.

我有一个在CSS中向上滚动图像的类.我希望能够连续创建3个这样的图像并使它们居中,但是因为它们是浮动的,所以它们不能居中.如果我将其更改为浮动中心,则图像将堆叠在彼此之上而不是并排堆叠.保证金左/右自动似乎也不起作用.我不知道该怎么做

我的CSS代码:

.pic {
  border: 3px solid#fafafa;  
  float: left;
  height: 250px;
  width: 300px;
  margin: 20;
  overflow: hidden;
   }
.aligncenter {text-align:center} 

/*VERTPAN*/
.vertpan img {
  display: block;
  margin-left: auto;
  margin-right:auto;
  margin-top: 0px;
  text-align: center;
  -webkit-transition: margin 1s ease;
     -moz-transition: margin 1s ease;
       -o-transition: margin 1s ease;
      -ms-transition: margin 1s ease;
          transition: margin 1s ease;
}

.vertpan img:hover {
  margin-top: -250px;
}
Run Code Online (Sandbox Code Playgroud)

我的HTML代码:

<div class = "vertpan pic"><img class="aligncenter" alt="climb" src="http://i.imgur.com/XIaOaId.jpg" /></div>
<div class = "vertpan pic"><img class="aligncenter" alt="climb" src="http://i.imgur.com/69K8qMU.jpg" /></div> …
Run Code Online (Sandbox Code Playgroud)

html css image center

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

center ×1

css ×1

html ×1

image ×1