html

最新推荐文章于 2022-11-30 10:54:53 发布

原创最新推荐文章于 2022-11-30 10:54:53 发布 · 176 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种利用CSS实现图片在网页中水平垂直居中的方法。通过设置div为table-cell并使用vertical-align和text-align属性，可以使内部的图片无论大小都能精准地居中显示。

1.让图片水平垂直居中

.title {
border: 1px solid red;
    width: 200px;
    height: 200px;
    vertical-align: middle;
    display: table-cell;//属性指让标签元素以表格单元格的形式呈现
    text-align: center;
}
   #img01{
   width: 100px;
    height: 100px;
   }
</style>