layui.table图片显示不全和404问题
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问题的更多相关文章
- matlab保存图片成eps格式不全,导致latex中图片显示不全的问题
我们经常会遇到这样的问题.用将matlab生成的图保存EPS格式后,用GSVIEW打开后,可以看到图片显示不全.遇到这种情况是,我们可以使用dvipdf——dvips的方法来生成PDF,这样生成的pd ...
- jquery easyui datagrid/table 右边线显示不全
<table id="dg" style="height:400px"></table> 右边线显示不全 解决:在外面套一个panel, ...
- 手机浏览PC版页面出现背景图片显示不全的问题解决方案
手机浏览PC版页面出现背景图片显示不全 给定宽高的值
- Word 固定行间距公式图片显示不全、Word Eculid 字体导致行间距过大、Word 行间距过大
1. 前言 1.有些文章行间距要求是固定值,比如,固定值15磅,但是这样会导致有些公式.图片显示不全.例如下图: 2.Euclid这个字体很容易导致行间距超大. 2. 解决方案 1.把固定值15磅改为 ...
- word公式图片显示不全的问题
最近处理文档遇到比较棘手的问题,就是单行显示的公式和图片都显示不全,高度撑不起来,会被其他行的内容遮挡. 图片估计是对齐方式照成的,公式调了很久也没有办法.最后找了一个临时折衷的办法: 插入表格,然后 ...
- 关于word图片显示不全
问题:在编辑word时,在其中一行插入一张图片,但是显示不全. 原因:给文字行距设置成 [ 固定值 ]的原因. 解决方案:先删除图片,在插入图片的一行右键--> 段落,弹出对话框,找到设置行距的 ...
- layui开关switch显示不全问题
先看效果: 开关显示不全,高度也不对称. 解决: 在所用到的html/jsp中自己加css .layui-form-switch { width: 52px; height: 23px; } 再看效果 ...
- (转)Word插入图片显示不全怎么办
https://jingyan.baidu.com/article/e73e26c0c0081c24adb6a73d.html 现在告诉大家解决办法. 方法一: A.单击选中图片,然后在“开始”选项卡 ...
- android 自定义ratingbar 图片显示不全的解决方案
在res/style中自定义评分条: <!-- 自定义评分条 --> <style name="roomRatingBar" parent="@andr ...
随机推荐
- codeforces 1110F
题解: 正解做法比较简单,考虑离线之后,相邻两个节点之间的答案是有关系的 发现从父亲移到儿子后,改变的距离对于当前节点子树内和子树外的是一样的 所以线段树维护一下区间加减取max就可以了 另外的做法1 ...
- tensorflow Tensorboard可视化-【老鱼学tensorflow】
tensorflow自带了可视化的工具:Tensorboard.有了这个可视化工具,可以让我们在调整各项参数时有了可视化的依据. 本次我们先用Tensorboard来可视化Tensorflow的结构. ...
- 平滑升级nginx到新版本
这里测试一下nginx的平滑升级,以备不时之需 查看nginx版本号: [root@zklf-server01 ~]# /application/nginx/sbin/nginx -V nginx v ...
- Docker 学习8 Dockerfile详解2
一.继续上章节Docker学习7 CMD命令后. 11.ENTRYPOINT a.容器启动后相当于会启动ENTRYPOINT + CMD 命令,CMD相当于参数传给entrypoint的 [root@ ...
- HTTP请求头中各字段解释
Accept : 浏览器(或者其他基于HTTP的客户端程序)可以接收的内容类型(Content-types),例如 Accept: text/plain Accept-Charset:浏览器能识别的字 ...
- Laravel修改验证提示信息为中文
1.覆盖提示信息: 打开resource/lang/en/validation.php注释掉英文提示信息 $ sudo vim resource/lang/en/validation.php 将下面的 ...
- macof python攻击脚本
#!/usr/bin/python import sys from scapy.all import * import time iface="eth0" if len(sys.a ...
- SpringBoot整合使用JdbcTemplate
JdbcTemplate是Spring框架自带的对JDBC操作的封装,目的是提供统一的模板方法使对数据库的操作更加方便.友好,效率也不错. 整合使用JdbcTemplate实现对图书的添加功能小案例 ...
- Exp4 恶意代码分析 20164302 王一帆
1.实践目标 1.1监控自己系统的运行状态,看有没有可疑的程序在运行. 1.2分析一个恶意软件,就分析Exp2或Exp3中生成后门软件:分析工具尽量使用原生指令或sysinternals,systra ...
- linux去除\r(window中编辑的文本)
vim -b file 二进制贷款文件:%s/^M//g # 注意这里使用Ctrl+V+M输入^M 上面的方法我就不行,但是下面的可以: 如果不行可以使用 :%s/\r//