css中怎么过去data-数据,Css中路径data:image/png;base64的用法详解

今天查看一些网站的css中发现了

background-image:url(data:image/png;base64,

iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABIdFAMAAAAGXR

FWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHhJRE

FUeNo8zjsOxCAMBFB/KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIB

hH5EAB8b+Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406KUgpt5/

LCKuVgz5BDCSb13ZO99ZOdcZGvt4mJjzMVKqcha68iIePB86G

AiOv8CDADlIUQBs7MD3wAAAABJRU5ErkJggg%3D%3D)

于是就百度了一下。查阅了一些资料。终于搞明白了

Data URI scheme是在RFC2397中定义的，目的是将一些小的数据，直接嵌入到网页中，从而不用再从外部文件载入。比如上面那串字符，其实是一张小图片，将这些字符复制黏贴到火狐的地址栏中并转到，就能看到它了，一张1X36的白灰png图片。

在上面的Data URI中，data表示取得数据的协定名称，image/png 是数据类型名称，base64 是数据的编码方法，逗号后面就是这个image/png文件base64编码后的数据。

目前，Data URI scheme支持的类型有：

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图片数据

我们把图像文件的内容直接写在了HTML 文件中，这样做的好处是，节省了一个HTTP 请求。坏处呢，就是浏览器不会缓存这种图像。大家可以根据实际情况进行自由取舍。

Css中路径data:image/png;base64的用法详解 (转载)

大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: background-image:url(data:image/png;base64, iVBORw0KGg ...

Python中第三方库Requests库的高级用法详解

Python中第三方库Requests库的高级用法详解 虽然Python的标准库中urllib2模块已经包含了平常我们使用的大多数功能,但是它的API使用起来让人实在感觉不好.它已经不适合现在的时代, ...

JavaScript中return的用法和this的用法详解

JavaScript中return的用法详解 最近,跟身边学前端的朋友了解,有很多人对this和函数中的return的用法和意思理解的比较模糊,这里写一篇博客跟大家一起探讨一下return和this的 ...

Css中路径data用法

Data URI scheme是在RFC2397中定义的,目的是将一些小的数据,直接嵌入到网页中,从而不用再从外部文件载入. data:,文本数据 data:text/plain,文本数据 data: ...

CSS中路径及form表单的用法

1.什么是路径? 路劲分为三种 1.绝对路径: 从盘符开始,然后依次的往下查找 本地: C:/Users/Administrator/Desktop/0527day01/07.html 服务器的: w ...

JavaScript中bind、call、apply函数用法详解

在给我们项目组的其他程序介绍 js 的时候,我准备了很多的内容,但看起来效果不大,果然光讲还是不行的,必须动手.前几天有人问我关于代码里 call() 函数的用法,我让他去看书,这里推荐用js 写服务 ...

PHP中public,private,protected,abstract等关键字用法详解

PHP中常用的关键字 在PHP中包含了很多对函数和类进行限制的关键字,常用的通常有abstract,final,interface,public,protected,private,static等等, ...

Shell编程中while与for的区别及用法详解【转】

在shell编程中经常用到循环,常用的循环有for和while循环两种.while循环默认以行读取文件,而for循环以空格读取文件切分文件,本篇就结合现网的一些使用示例说说二者的用法和区别. 一.常用 ...

java中的值传递和引用传递用法详解

值传递:方法调用时,实际参数把它的值传递给对应的形式参数,方法执行中形式参数值的改变不影响实际参 数的值. 引用传递:也称为传地址.方法调用时,实际参数的引用(地址,而不是参数的值)被传递给方法中相对 ...

随机推荐

RabbitMQ安装实践

背景: 最近一个项目的测试环境需要用到rabbitMQ,但运维和开发都没时间,于是自己试着安装了一发,发现安装很简单,记一笔如下: 安装步骤 查看官网上有不同的安装方法,可使用下载安装包或者直接通过其 ...

MVC中使用Ajax提交数据 Jquery Ajax方法传值到action

Jquery Ajax方法传值到action

无法访问 IIS 元数据库。您没有足够的特权访问计算机上的 IIS 网站

我是WIN10+VS2015  之前用的是VS2012     后来卸载了VS2012 就出现了这个错误,请问该如何解决 在VS的图标上 按右键用管理员(Administrator)运行

ZooKeeper使用原理

ZooKeeper的基本原理 ZNode的基本概念 ZooKeeper数据模型的结构与Unix文件系统很类似,整体上可以看作是一棵树,每个节点称做一个ZNode.每个ZNode都可以通过其路径唯一标识 ...

Hackers’ Crackdown-----UVA11825-----DP+状态压缩

题目地址:http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

debug的一些按钮意义

F9 resume programe 恢复程序 Alt+F10 show execution point 显示执行断点 F8 Step Over 相当于eclipse的f6 跳到下一步 F7 Step ...

MYSQL主从同步/主主同步

一.MYSQL主从同步 注意:进行主从同步操作时需要确保DB无写操作 flush tables with read lock:   //全局读锁定,执行了命令之后所有库所有表都被锁定只读. 1.在主机 ...

[leetcode]32. Longest Valid Parentheses最长合法括号子串

Given a string containing just the characters '(' and ')', find the length of the longest valid (wel ...

Activity生命周期详解

http://blog.csdn.net/liuhe688/article/details/6733407 onPause 回到 onResume 的过程“在一般的开发中用不上”,但是作为开发者还是有 ...

PCL点云特征描述与提取(2)

点特征直方图(PFH)描述子 正如点特征表示法所示,表面法线和曲率估计是某个点周围的几何特征基本表示法.虽然计算非常快速容易,但是无法获得太多信息,因为它们只使用很少的几个参数值来近似表示一个点的k邻 ...