响应式缩略图宽度和高度1:1css实现方法_扶摇网络

我们只做利于SEO的网站

响应式缩略图宽度和高度1:1css实现方法

来源:扶摇网络 作者:网站建设/SEO优化专家 浏览: 发布日期:2021-09-19 22:30:49
[导读]:核心就是给图片容器加一个padding-top: 100%撑开高度.image-box {    display: block;    position: relative;    height: 0;    padding-top: 100%;    ove...

核心就是给图片容器加一个padding-top: 100%撑开高度

.image-box {

    display: block;

    position: relative;

    height: 0;

    padding-top: 100%;

    overflow: hidden;

}

.image-box img{

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}


大家有疑问,可以在下边留言交流,我有空会及时回复,本人英文网名:Cheng,中文网名:陆小凤。
免责声明:本文由专注多年品牌设计公司扶摇网络整理编写,旨在为企业提供网络知识分享,如有侵权请联系删除,转栽请注明出处.
加载中~
微信咨询网站建设

扫一扫高效沟通

访问网站建设手机端

扫描访问手机网站

多一份参考总有益处

免费领取网站策划SEO优化策划方案

请填写下方表单,我们会尽快与您联系
感谢您的咨询,我们会尽快给您回复!