Bootstrap中data-src无法显示图片,但是src可以
在学习bootstrap时,书中的源码是用的data-src来定义图像位置,但是我在使用的时候无法显示图片;data-src可以在img标签中使用来显示图片吗?我使用src可以,而是用data-src不可以。书上的源码:
class="thumbnail"> <<span class="hljs-name">img
data-src="图片地址" alt="..."> <<span class="hljs-name">div
class="caption"> <<span class="hljs-name">h3>Thumbnaillabel</<span
class="hljs-name">h3> <<span
class="hljs-name">p>...</<span class="hljs-name">p>
<<span
class="hljs-name">p> <<span class="hljs-name">a href="#"
class="btn
btn-primary">Action</<span
class="hljs-name">a> <<span class="hljs-name">a href="#"
class="btn
btn-default">Action</<span
class="hljs-name">a> </<span class="hljs-name">p>
</<span
class="hljs-name">div> </<span class="hljs-name">div>
本来就是src的才会显示。data-src只是注意储存的,比如做懒加载的时候就可以把真实的url先写到这个属性里面
用来做动态延迟加载的,就是懒加载的
那开始的时候索性src也别用。用其他的比如src1。
然后对遍历所有的img标签,如果有data-src的,将其值赋给src,如果没有data-src,则将src1的值赋给src
Bootstrap中data-src无法显示图片,但是src可以的更多相关文章
- [AX]AX2012 R2 EP员工自助服务中的产品不能显示图片的问题
在员工自助服务EP站点中员工可以通过Order products自助提交采购申请,在正确设置员工采购目录后会罗列出允许员工购买的产品,每个产品都可带有图片,我们可以通过Product image来为产 ...
- 【Vue中的坑】vue项目中动态绑定src不显示图片解决方法
v-for绑定src的数据如下: data() { return { img_src:"../../assets/images/mirror-service.png" } } 渲染 ...
- bootstrap中如何让响应式图片(img-responsive)水平居中
我们在用bootstrap排版内容的时候,有的时候在内容中需要图片水平居中对齐. 一般情况下,我们的图片都使用了 .img-responsive 类来实现响应式图片.如果需要实现响应式图片水平居中,那 ...
- win7中资源管理器不能显示图片预览的解决方法
在用xp的时候,在资源管理器里面预览图片文件是在普通不过的事情了.换到win7之后,图片文件一直不能预览,只是显示图标还挺烦的.肯定是哪里设置的不对,下午闲来无事,找到是哪里的问题了. 如果你也遇到相 ...
- bootstrap中日历组件只显示年月
大多数情况下日历组件我们使用的都是yyyy-mm-dd的日历格式,但是有时候需求不需要我们精确到日,而是最小单位到月份(yyyy-mm),网上找了很多方法,但是都没有我想要的效果,一些属性的设置都没有 ...
- img src 直接显示图片字符串,微信例子
<div class="weui-cell__hd"><img src="data:image/png;base64,iVBORw0KGgoAAAANS ...
- vue bootstrap中modal对话框不显示遮挡打不开
使用Vue bootstrap时,点击modal却不能弹出来,被隐藏遮挡无法显示,参考下面的这个博客的说明解决了这个问题: Heap Stack Blog(pingbook.top)Vue boots ...
- Qt:添加点击事件的Label并显示图片
1.给label添加点击事件 Qt中原本的label是没有点击事件的,如果想添加点击事件的话,可以继承QLabel类并重载鼠标事件(比如mousePressedEvent),然后在鼠标事件中发送一个信 ...
- vue中通过定义的数组循环将img的src引入图片却不显示图片问题解决方法
需要前端循环图片数组将其放到页面中去. 需要将src渲染到页面中,如果单纯写src的路径会出现不显示图片的问题 因为图片路径在assets,所以需要require一下.
随机推荐
- Disruptor并发框架 (二)核心概念场景分析
核心术语 RingBuffer(容器): 被看作Disruptor最主要的组件,然而从3.0开始RingBuffer仅仅负责存储和更新在Disruptor中流通的数据.对一些特殊的使用场景能够被用户( ...
- Java的演化-Java8实战笔记
一个语言要想一直有活力,它也需要跟随着时代的变化去进步,Java作为一个古老的语言,它其实有太多的历史包袱,在改变的过程中需要考虑很多,但是它也在慢慢的演变,巩固自己的城墙,不让自己被遗忘在历史中(不 ...
- ubuntu14 搭建单机版hadoop2.6
1. 如果你的集群尚未安装所需软件,你得首先安装它们. 以Ubuntu Linux为例: $ sudo apt-get install ssh $ sudo apt-get install rsync ...
- K:线性表的实现—链表
单链表的概念: 采用链式存储方式存储的线性表称之为链表,链表中每个节点包含存放数据元素的值的数据域和存放指向逻辑上相邻节点的指针域.若一个节点中只包含一个指针域,则称此链表为单链表. 单链表的特点: ...
- PHP函数register_shutdown_function的使用
函数简介当PHP程序执行完成后,自动执行register_shutdown_function函数,该函数需要一个参数,用来指定由谁处理这些后续的工作.其中,程序执行完成,分为以下几种情况:第一种:ph ...
- Python并发实践_02_通过yield实现协程
python中实现并发的方式有很多种,通过多进程并发可以真正利用多核资源,而多线程并发则实现了进程内资源的共享,然而Python中由于GIL的存在,多线程是没有办法真正实现多核资源的. 对于计算密集型 ...
- 【JavaScript 】for 循环进化史
ECMAScript 6已经逐渐普及,经过二十多年的改进,很多功能也有了更成熟的语句,比如 for 循环 这篇博客将介绍一下从最初的 for 循环,到 ES6 的 for-of 等四种遍历方法 先定义 ...
- PHP错误与异常
请一定要注意,没有特殊说明:本例 PHP Version < 7 说起PHP异常处理,大家首先会想到try-catch,那好,我们先看一段程序吧:有一个test.php文件,有一段简单的PHP程 ...
- 【读书笔记】【深入理解ES6】#7-Set集合和Map集合
ES6新标准中将Set集合和Map集合添加到JS中. ES5中Set集合和Map集合 在ES5中,开发者们用对象属性来模拟这两种集合. var set = Object.create(null); s ...
- visualSVN 版本控制
用SmartSVN提交代码的时候提示:svn: File has inconsistent newlines 这是由于要提交的文件编码时混合了windows和unix符号导致的. 解决方法: Proj ...