banner图片自适应

今天公司要求把banner改为cms上传，所以前端必须用<image/>标签来实现，但是用image标签无法实现像background这样的上下左右居中，导致无法自适应屏幕。单单这个问题就纠结了一天也没找到好的办法，包括css3的margin-right:(50% - 980px);margin-right:(50% - 980px);因为用的插件是flexslider插件，最后还是失败了。最后恍然大悟找到了答案，请看代码

<ul class="slides">
<c:if test="${it.entity.banners != null}">
<c:forEach var="banners" items="${it.entity.banners.results}">
<li>
<a href="${banners.url}" >
<div style="background:url(${banners.content}) center center;height:375px;"></div>
</a>
</li>
</c:forEach>
</c:if></ul>

原来可以直接用样式添加background