【博客美化】10.图片预览放大

博客园美化相关文章目录：

一、背景

写文章用到的图片尺寸都很大，但是放到博客里面就显得比较小，所以每次看图时需要打开新标签页来看大图，有没有什么办法直接在博客里面预览大图呢？有的，CSS的强大功能就可以帮助实现

二、放大预览效果

三、代码实现

看一样CSS怎么做到的：

#mainContent img
{
    z-index: 1000; //设置为最顶层，以免左侧导航栏遮挡
    position: relative;
    cursor: pointer;//鼠标样式：手势
    transition: all 1.2s; //放大的时间：1.2s
}
#mainContent img:hover {
    transform: scale(1.4); //放大倍数：1.4倍
}

将这段代码粘贴到页面定制CSS代码里面

关注公众号：悟空聊架构，回复pmp，领取pmp资料！回复悟空，领取架构师资料！

悟空聊架构

关注我，带你每天进步一点点！

还有111本书籍赠送~~