css中怎么让图片在中间

CSS中怎么让图片在中间
为了让图片居中，我们需要使用一些CSS技巧。下面我们就来讲解一下，在CSS中如何让图片在中间。
首先，我们可以使用text-align属性来实现图片水平居中，如下所示：
p{
text-align:center;
}
这样设置之后，p标签内的图片就会居中显示了。
但是，要实现图片在垂直方向上的居中就比较困难了。因为在CSS中，并没有像text-align这样专门用来处理垂直居中的属性。不过我们可以使用一些技巧来实现。
一种方法是将图片转换为块级元素，然后设置它的margin属性。代码如下：
pre{
display:block;
margin:auto;
}
这种方法可以很好地将图片在容器中水平、垂直居中。我们可以使用预设的图片大小，或者设置图片的宽度和高度来达到不同的效果。不过，这种方法有一个缺点，那就是图片的大小必须是固定的。
还有一种方法是使用CSS3的transform属性。使用translate()函数可以将图片在垂直方向上相对于容器进行移动。代码如下：
pre{
position:relative;
top:50%;
transform:translateY(-50%);
}
这种方法需要将容器的position属性设置为relative，因为只有这样才能让自身成为原点，从而实现相对于容器进行移动。这种方法不用考虑图片大小，可以适用于任何大小的图片。
总结一下，要让图片实现在CSS中的居中，可以使用text-align属性实现水平居中，使用margin或者transform属性实现垂直居中。不同方法适用的场景不同，需要根据实际情况选择合适的方法。