等比例，首先需要一个比例值，如：4:3 = 3/4 = 0.75。你还是需要给图片添加一个包裹，然后给这个包裹写样式就可以了。

<p class="img-scale img-scale-4-3">
    <img src="*.jpg" alt="" />
</p>

然后，使用绝对定位和相对定位：

.img-scale {
    position: relative;
    font-size: 0; /* 防止图片底部出现空白 */
    height: 0; /* 此处的高度是一个比例关系 */
    width: 100%; /* 宽度是固定的，而高度是百分比的，因此可实现自适应 */
}
.img-scale.img-scale-4-3 {
    padding-bottom: 75%; /* 宽度100% + 高度 75% = 4：3关系 */
}
.img-scale img {
    position: absolute;
    left: 0; /* 需要完整填充到父容器 */
    top: 0;
    height: 100%;
    width: 100%;
}

其他比例关系也是类似的计算，如：.img-scale-16-9等。
你这个实例的代码可以这样调整：

<li><!--这是条目容器，其高度是内部的span‘撑开’的-->
    <a href="javascript:;" class="img_1"><!--这是点击区域，通常为100%-->
        <span class="img-scale img-scale-4-3"><!--这是显示区域，可为960+，配合max-width实现自适应-->
            <img src="***" alt="" />
        </span>
    </a>
</li>

修改后可实现全屏或固定尺寸的幻灯片。

img
{
width:100%;
height:auto;
}

这样写是等比里缩放的。或者

img
{
width:x;//图片的宽度
height:auto;
}