所谓"data"类型的Url格式，是在RFC2397中 提出的，目的对于一些“小”的数据，可以在网页中直接嵌入，而不是从外部文件载入。例如对于img这个Tag，哪怕这个图片非常非常的小，小到只有一个 点，也是要从另外一个外部的图片文件例如gif文件中读入的，如果浏览器实现了data类型的Url格式，这个文件就可以直接从页面文件内部读入了。

例：下面这一段代码放到url地址栏访问会得到一个加粗的"Hello, world!"

data:text/html,<html><body><p><b>Hello, world!</b></p></body></html>

简单的说，data类型的Url大致有下面几种形式。

data:,<文本数据>

data:text/plain,<文本数据>

data:text/html,<HTML代码>

data:text/html;base64,<base64编码的HTML代码>

data:text/css,<CSS代码>

data:text/css;base64,<base64编码的CSS代码>

data:text/javascript,<Javascript代码>

data:text/javascript;base64,<base64编码的Javascript代码>

data:image/gif;base64,base64编码的gif图片数据

data:image/png;base64,base64编码的png图片数据

data:image/jpeg;base64,base64编码的jpeg图片数据

data:image/x-icon;base64,base64编码的icon图片数据

  因为Url是一种基于文本的协议，所以gif/png/jpeg这种二进制属于需要用base64进行编码。换句话说，引入base64以后，就可以支持任意形式的数据格式。

data类型的url的更多相关文章

  1. 【转】浏览器中的data类型的Url格式,data:image/png,data:image/jpeg!

    所谓"data"类型的Url格式,是在RFC2397中 提出的,目的对于一些"小"的数据,可以在网页中直接嵌入,而不是从外部文件载入.例如对于img这个Tag, ...

  2. 浏览器中的data类型的Url格式,data:image/png,data:image/jpeg!(源自：http://blog.csdn.net/roadmore/article/details/38498719)

    所谓"data"类型的Url格式,是在RFC2397中 提出的,目的对于一些“小”的数据,可以在网页中直接嵌入,而不是从外部文件载入.例如对于img这个Tag,哪怕这个图片非常非常 ...

  3. MVC验证12-使用DataAnnotationsExtensions对整型、邮件、最小值、文件类型、Url地址等验证

    原文:MVC验证12-使用DataAnnotationsExtensions对整型.邮件.最小值.文件类型.Url地址等验证 本文体验来自http://dataannotationsextension ...

  4. 设计一个方法injectBeforeAsyncSend，能够实现如下功能：在发起异步请求之前打印出请求的类型、URL、method、body、timestamp 等信息。

    异步请求逻辑注入 工作中我们需要对异步请求的请求信息打印日志,但是又不能耦合在业务代码中打印.请设计一个方法injectBeforeAsyncSend,能够实现如下功能:在发起异步请求之前打印出请求的 ...

  5. ssm整合快速入门程序(三)之Data类型转换器

    今天就写写springmvc配置Data类型转换器 首先在创建一个转换器的包cn.my.ssm.controller.converter,创建一个CustomDateConverter类实现Conve ...

  6. 第 7 章 Data 类型

    目录 第 7 章 Data 类型 一.创建方式 二.转时间戳 其他 第 7 章 Data 类型 @(es5) 参考了: 阮一峰javascript的标准.<javascript高级教程> ...

  7. 如何将查出的日期Data类型以Json格式输出到前端

    方法一 在返回的实体的属性中加上注解 // 创建时间    @DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss")    private ...

  8. go学习笔记-Data类型（Arrays, Slices and Maps）

    Data类型(Arrays, Slices and Maps) array array就是数组,定义方式如下: var arr [n]type 在[n]type中,n表示数组的长度,type表示存储元 ...

  9. MySQL中DATA类型数据和DATATIME类型数据的比较

    在网上大题查了下这个问题,网上有的人说可以直接比较,并给出了测试用例,也有的人说不能比较,于是我自己尝试了一下,实际测试是可以的,不过,当传入DATA类型时间与DATATIME类型时间进行比较的时候, ...

随机推荐

  1. C# 基础知识系列- 16 开发工具篇

    0. 前言 这是C# 基础知识系列的最后一个内容讲解篇,下一篇是基础知识-实战篇.这一篇主要讲解一下C#程序的结构和主要编程工具. 1. 工具 工欲善其事必先利其器,在实际动手之前我们先来看看想要编写 ...

  2. 高精度封装Bignum

    还没有写完,目前只实现了加,乘,且不能作用于负数 \(update\ in 20.4.8 添加了高精除低精ddiv函数,比较大小comp函数\) #include <bits/stdc++.h& ...

  3. Codeforces Round #626 D. Present

    D. Present 题目大意:给你一个大小是n的序列,求两两之间相加进行异或之后的答案. 这个题目我并没有想到怎么写,有点偷懒于是就去看了题解.. 题解很套路... 题解: 因为这个是用到了异或,所 ...

  4. .NET Core+QQ第三方授权登录

    安装包 dotnet add package AspNet.Security.OAuth.QQ 接上文GitHub第三方授权登录 申请过程不介绍了,申请者资料,个人也是可以申请成功的. 这时候有二个参 ...

  5. Java BC包做sm2加密方法 ，签名验签方法

    package com.sdyy.common.bc_sm2; import org.bouncycastle.jcajce.provider.asymmetric.x509.CertificateF ...

  6. metasploit payload运行原理浅析

    背景 最近在做一些msf相关的事情,今天听到免杀相关的,去查询了下相关资料. 第一个不能错过的就是cobalt strike作者早年写的metasploit-loader项目了,我看了项目源码,找了一 ...

  7. HTTP接口测试

    HTTP接口测试 1.1 get接口 请求URL http://api.nnzhp.cn/api/user/stu_info 请求方式 get 请求参数 参数名 必选 类型 说明 stu_name 是 ...

  8. 【Flink】使用之前，先简单了解一下Flink吧！

    目录 Flink简单介绍 概述 无边界数据流和有边界数据流 技术栈核心组成 架构体系 重要角色 Flink与Spark架构概念转换 Flink简单介绍 概述    在使用Flink之前,我们需要大概知 ...

  9. spark-2.4.5 安装记录

    参考 https://data-flair.training/blogs/install-apache-spark-multi-node-cluster/ 下载 spark 地址为 http://sp ...

  10. Windows命令行：xcopy、move、rename

    Windows命令行,xcopy复制粘贴,move剪切粘贴,rename/ren重命名.当简单事情重复做时,Windows命令行有用武之地了.批命令中,暂时用不到的行,用两个冒号注释掉. 不同路径下, ...