多语言展示
当前在线:1989今日阅读:86今日分享:14

css如何设置图片垂直居中

css如何让标签自动垂直居中呢?让我们一起来看一看。居中样式代码:.img-center{    position: absolute;    top: 0;    right: 0;    bottom: 0;    left: 0;    margin: auto;   }
方法/步骤
1

新建一个html文件,在这个html文件上创建一个标签,然后对这个标签设置图片路径,最后为这个标签添加一个类(案例中类为:img-center)

2

对img-center类设置样式。1.设置positon定位为绝对定位,上下左右的距离都为:0;2.设置这个类的外编辑为:auto。代码:.img-center{    position: absolute;    top: 0;    right: 0;    bottom: 0;    left: 0;    margin: auto;    width: 300px;   }

3

保存html文件后,使用浏览器打开,即可看到图片自动居中。

4

所有代码。可以直接复制所有代码,粘贴后运行即可看到效果。所有代码:     图片自动水平垂直居中       

推荐信息