查看: 24056|回复: 4
打印 上一主题 下一主题

swiper做全屏轮播图时怎样让图片自适应

[复制链接]

该用户从未签到

1

主题

2

帖子

53

积分

注册会员

Rank: 2

积分
53
跳转到指定楼层
楼主
发表于 2015-6-11 18:09:03 | 只看该作者 |只看大图 回帖奖励 |倒序浏览 |阅读模式
swiper做全屏轮播图时怎样让图片自适应,也就是一直在屏幕的正中间,如图,在缩小屏幕时图片没有跟着自适应

j1.png (738.37 KB, 下载次数: 255)

j1.png

j2.png (621.4 KB, 下载次数: 164)

j2.png
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 分享淘帖
回复

使用道具 举报

该用户从未签到

1

主题

5

帖子

17

积分

新手上路

Rank: 1

积分
17
推荐
发表于 2015-6-15 14:15:37 | 只看该作者
img 设置百分比,100%是铺满,不是100%的时候把父容器设为margin:0 auto; 这样可以居中对齐。
回复 支持 1 反对 0

使用道具 举报

  • TA的每日心情

    2017-12-27 10:36
  • 签到天数: 2 天

    [LV.1]初来乍到

    1万

    主题

    1万

    帖子

    7万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9

    积分
    76581
    沙发
    发表于 2015-6-12 10:12:07 | 只看该作者
    图片宽度设成百分比呢
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    0

    主题

    2

    帖子

    19

    积分

    新手上路

    Rank: 1

    积分
    19
    地板
    发表于 2016-9-19 10:38:44 | 只看该作者
    .swiper-slide {background-position: center;background-size: cover;}

    <div class="swiper-slide" style="background-image:url('pic.jpg')"></div>

    这种方法可以解决!
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    0

    主题

    1

    帖子

    4

    积分

    新手上路

    Rank: 1

    积分
    4
    5#
    发表于 2017-1-5 13:56:47 | 只看该作者
    本帖最后由 ymx 于 2017-1-5 14:01 编辑

    1111111111111111111111111111
    回复 支持 反对

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

    GMT+8, 2024-11-24 03:06 , Processed in 0.065009 second(s), 31 queries .

    Powered by Discuz! X3.2

    © 2001-2013 Comsenz Inc.

    快速回复 返回顶部 返回列表