手机端横向展示内容

实例

<div class="show-img">
                 <ul class="show-img-box">
                                <li>
                                    <img src="../img/screen.png" alt="展示"  heihgt="600"> 
                                </li>
                                <li>
                                    <img src="../img/screen.png" alt="展示"  heihgt="600"> 
                                </li>
                                <li>
                                    <img src="../img/screen.png" alt="展示" heihgt="600"> 
                                </li>
                            </ul>
                        </div>

<div class="show-img">
    <ul class="show-img-box">
        <li>
            <img src="../img/screen.png" alt="展示"  heihgt="600"> 
        </li>
        <li>
            <img src="../img/screen.png" alt="展示"  heihgt="600"> 
        </li>
        <li>
            <img src="../img/screen.png" alt="展示" heihgt="600"> 
        </li>
    </ul>
</div>

/* =三张图片展示= */
.show-img{width: 100vw; max-width: 768px; height: 606px; overflow: hidden; overflow-x: auto; margin-left: -15px; }
ul.show-img-box{ background-color: #f0f0f0; width: 300vw; max-width: 2308px;}
ul.show-img-box li{ width: 100vw; max-width: 768px;  text-align: center; }
ul.show-img-box li img{vertical-align: baseline; }