最新公告
  • 欢迎您光临站长源码网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • 写一个简单的自适应css,根据分辨率调用不同的图片

    正文概述 管理员   2024-09-02   70

    前两天仿了一个站,但是有很多不如意的地方,比如自适应的问题,我想根据它的分辨率调用不同的样式,在PC端调用图片1在移动端调用图片2,一开始以为通过js可以解决,但是网上翻了半天没找出一个正儿八经的解决方案,不得以来找前端大神朋友,大神几下给我出了一个简单的自适应css,原来直接用@media控就行了,贴在下面。

    <style>
    .pc{ display:block;}
    .pc img{ display:block; margin:0 auto;}
    .Mobile{ display:none;}
    .Mobile img{ width:100%;}
    @media screen and (max-width:640px) {
    .pc{ display:none;}
    .Mobile{ display:block;}
    }
    </style>
    

    在需要调用的地方加上以下代码

    <div class="pc">
    <img src="/1.jpg">
    </div>
    <div class="Mobile">
    <img src="/2.jpg" />
    </div>
    


    站长源码网 » 写一个简单的自适应css,根据分辨率调用不同的图片

    发表评论

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    支付宝支付
    微信支付
    余额支付
    ×
    微信扫码支付 0 元