1.图片显示不全

在使用layui.table组件中,加载的图片显示不全,需重新定义CSS如下:

.layui-table-cell{
height: auto!important;
white-space: normal;
}

2.图片显示,路径404

在组件中加载图片,本人使用的是如:

{field: 'image', title: '商品图片', align:'center',width:, templet:'<div><img href="{{ d.image }}"></div>',style:'height:50px;'}

结果:图片在表格中显示,但浏览器会另外加载一张图片

使用模板改正就没有这个问题:

首先定义模板,(因为是laravel框架,所以需要@来避免被解析):

    <script type="text/html" id="imgTpl">
<img src="@{{ d.avatar }}">
</script>

再在layui.table中定义:

{field: 'avatar', title: '头像', align:'center',width:150, templet:'#imgTpl'}

问题解决

layui.table图片显示不全和404问题的更多相关文章

  1. matlab保存图片成eps格式不全,导致latex中图片显示不全的问题

    我们经常会遇到这样的问题.用将matlab生成的图保存EPS格式后,用GSVIEW打开后,可以看到图片显示不全.遇到这种情况是,我们可以使用dvipdf——dvips的方法来生成PDF,这样生成的pd ...

  2. jquery easyui datagrid/table 右边线显示不全

    <table id="dg" style="height:400px"></table> 右边线显示不全 解决:在外面套一个panel, ...

  3. 手机浏览PC版页面出现背景图片显示不全的问题解决方案

    手机浏览PC版页面出现背景图片显示不全 给定宽高的值

  4. Word 固定行间距公式图片显示不全、Word Eculid 字体导致行间距过大、Word 行间距过大

    1. 前言 1.有些文章行间距要求是固定值,比如,固定值15磅,但是这样会导致有些公式.图片显示不全.例如下图: 2.Euclid这个字体很容易导致行间距超大. 2. 解决方案 1.把固定值15磅改为 ...

  5. word公式图片显示不全的问题

    最近处理文档遇到比较棘手的问题,就是单行显示的公式和图片都显示不全,高度撑不起来,会被其他行的内容遮挡. 图片估计是对齐方式照成的,公式调了很久也没有办法.最后找了一个临时折衷的办法: 插入表格,然后 ...

  6. 关于word图片显示不全

    问题:在编辑word时,在其中一行插入一张图片,但是显示不全. 原因:给文字行距设置成 [ 固定值 ]的原因. 解决方案:先删除图片,在插入图片的一行右键--> 段落,弹出对话框,找到设置行距的 ...

  7. layui开关switch显示不全问题

    先看效果: 开关显示不全,高度也不对称. 解决: 在所用到的html/jsp中自己加css .layui-form-switch { width: 52px; height: 23px; } 再看效果 ...

  8. (转)Word插入图片显示不全怎么办

    https://jingyan.baidu.com/article/e73e26c0c0081c24adb6a73d.html 现在告诉大家解决办法. 方法一: A.单击选中图片,然后在“开始”选项卡 ...

  9. android 自定义ratingbar 图片显示不全的解决方案

    在res/style中自定义评分条: <!-- 自定义评分条 --> <style name="roomRatingBar" parent="@andr ...

随机推荐

  1. So, How About UMD模块-Universal Module Definition

    在ES6模块解决方案出现之前,工具库或包常用三种解决方案提供对外使用的接口,最早是直接暴露给全局变量,比如我们熟知的Jquery暴露的全局变量是$,Lodash对外暴露的全局变量是_,后来出现了AMD ...

  2. 简单使用sp_executesql 参数化

    declare @totalCount1 int output declare @id1 varchar(10) declare @strsql1 nvarchar(max)=N'' declare ...

  3. pycharm创建scrapy项目教程及遇到的坑

    最近学习scrapy爬虫框架,在使用pycharm安装scrapy类库及创建scrapy项目时花费了好长的时间,遇到各种坑,根据网上的各种教程,花费了一晚上的时间,终于成功,其中也踩了一些坑,现在整理 ...

  4. 029 Es面试小节

    1.大纲 Es是什么?处理哪种业务逻辑用的多? Es类比数据库是什么? 对于数据库的字段.表等,在es中叫什么? Es的refresh把数据写到哪里? Es的数据如何变成检索和聚合索引的? Es的fl ...

  5. scala_2

    一.scala类 . 在java中程序的入口是main方法->定义在class中 在scala中程序的入口是main方法->定义在object对象中 案例一: class People { ...

  6. 远程服务器数据交互技术:rsync,scp,mysqldump

    远程服务器间数据文件交互,可用技术:rsync,scp 速度:rsync是非加密传输,比scp快 安全:scp为加密传输 备份体量:rsync只更新差异部分,可以做增量和全量备份.scp为全量 传输方 ...

  7. Centos7使用kubeadm部署kubernetes-1.11.2

    1.安装方式 1.  传统方式,以下组件全部运行在系统层面(yum或者rpm包),都为系统级守护进程 2.  kubeadm方式,master和node上的组件全部运行为pod容器,k8s也为pod ...

  8. oracle行转列、列转行、连续日期数字实现方式及mybatis下实现方式

    转载请注明出处:https://www.cnblogs.com/funnyzpc/p/9977591.html 九月份复习,十月份考试,十月底一直没法收心,赶在十一初 由于不可抗拒的原因又不得不重新找 ...

  9. Numpy 基础运算2

    # -*- encoding:utf-8 -*- # Copyright (c) 2015 Shiye Inc. # All rights reserved. # # Author: ldq < ...

  10. TypeScript 函数-Lambads 和 this 关键字的使用

    let people = { name:["a","b","c","d"], /* getName:function() ...