layui中怎么表格里显示图片-创新互联

这篇文章给大家介绍layui中怎么表格里显示图片,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。

目前累计服务客户上千家,积累了丰富的产品开发及服务经验。以网站设计水平和技术实力,树立企业形象,为客户提供成都网站建设、网站建设、网站策划、网页设计、网络营销、VI设计、网站改版、漏洞修补等服务。成都创新互联始终以务实、诚信为根本,不断创新和提高建站品质,通过对领先技术的掌握、对创意设计的研究、对客户形象的视觉传递、对应用系统的结合,为客户提供更好的一站式互联网解决方案,携手广大客户,共同发展进步。

1、jsp代码

   发布Banner

2、然后是js代码

layui.use('table', function(){    var table = layui.table;  table.render({    elem: '#banner',url:'../banner/list',cols: [[     {field:'ban_id',width:20,title: 'ID', sort: true}            ,{field:'ban_img',title: '图片',templet:'
'}    ,{field:'ban_content', title: '备注'}    ,{field:'ban_href', title: '地址'} ]]});});

注意:这里需要注意的是,加入了templet,这里就是加入表单元素等模板

其中这个d代表的就是服务器返回的数据,ban_img是数据对应的字段名

   发布Banner
     .layui-table-cell{    text-align:center;    height: auto;    white-space: normal;    }

可以看到我在底部加上了样式,这里有优先级的问题,所以必须是放在最下面,谨记!!!

原来如此,layui内部定义了这么一个样式,所以话不多说,改!


.layui-table-cell{text-align:center;height: auto;white-space: normal;}.layui-table img{max-width:300px}

关于layui中怎么表格里显示图片就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。


名称栏目:layui中怎么表格里显示图片-创新互联
网站URL:http://myzitong.com/article/djiehj.html

其他资讯