Bootstrap中data-src无法显示图片,但是src可以

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>Thumbnail label </<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

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/114253.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • c语言中system函数怎么用_system函数的返回值

    c语言中system函数怎么用_system函数的返回值C语言中如何使用system函数一.system函数c语言中的system()函数主要用于发出一个DOS命令,该函数已经收录在标准c库中,可以直接调用。使用时包含头文件<stdlib.h>补充:DOS:DOS是DiskOperatingSystem的缩写,即磁盘操作系统。它是一个基于磁盘管理的操作系统。DOS命令:是指DOS操作系统的命令,是一种面向磁盘的操作命令,主要包括目录操作类命令、磁盘操作类命令、文件操作类命令和其它命令。(学习DOS命令是控制微机的基础)提供用户使用的

    2022年9月15日
    0
  • C语言实现【关机程序】「建议收藏」

    C语言实现【关机程序】「建议收藏」在讲解关机程序前,必须得先知道一个库函数system(“shutdown-s-t60”)和system(“shutdown-a),其中“shutdown-s”表示关机,“shutdown-a”表示取消关机,“-t60”表示延迟60秒;而要使用该库函数就得引头文件#include<stdlib.h>。下面开始实现关机程序了:#include<stdio.h>#include<stdlib.h>#include<string.h>int.

    2022年7月22日
    6
  • 超级用户权限root_小米开发版root权限获取

    超级用户权限root_小米开发版root权限获取小米手机6X有没有办法开启ROOT超级权限?我们知道,安卓手机有ROOT超级权限,如果手机开启root相关权限,能够实现更好的功能,举例子,我们部门的营销部门,使用一些营销软件都需要在ROOT超级权限下执行,如果手机没办法获的root的权限,即没办法正常使用具体的功能。小米手机6X开发版系统自身拥有root权限管理工具,如果你使用的是小米手机6X稳定版,建议可以先将小米手机6X刷入开发版,再进…

    2022年10月31日
    0
  • 科研方法与学术论文写作_科技论文写作与发表教程第八版pdf

    科研方法与学术论文写作_科技论文写作与发表教程第八版pdf导读:本文推荐四个学术英语写作用到的网站/插件,让你的表达更地道,更多样,减少错误。它们分别是:AcademicPhrasebank,Linggle,collocaid,grammely。1.AcademicPhrasebank网址:http://www.phrasebank.manchester.ac.uk/这个网站提供论文各部分的模版,如介绍怎么写,总结怎么写,如何描述方法,报告细节等。比如现在需要在文章中举例,可以点击GivingExamples,点击页面显示的各项内容.

    2022年10月29日
    0
  • 计算机ata考试试题答案,计算机ATA考试(高级)第一套试卷

    计算机ata考试试题答案,计算机ATA考试(高级)第一套试卷计算机ATA考试(高级)第一套试题一、启动资源管理器二、在C盘的根目录下新建文件夹,文件名为“4000001”三、将C盘下“KSML2”文件夹内的文件KS1-7.DOC、KS2-5.DOC、KS3-14.DOC、KS4-20.XLS、KS5-8.XLS、KS6-6.ppt、KS7-18.XLS、KS8-4.PST一次性复制到C盘下4000001文件夹中,并分别重命名为A1.DOC、A2.DOC、A…

    2022年7月13日
    20
  • NGUI中穿插粒子或者mesh渲染层级

    NGUI中穿插粒子或者mesh渲染层级

    2022年2月22日
    34

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号