各自含义:
data: ----获取数据类型名称
image/gif; -----指数据类型名称
base64 -----指编码模式
AAAAA ------指编码以后的结果。

background-image: url(data:image/gif;base64,AAAA)这句话的意思总体就是“获取数据类型是image gif文件,编码采用ASCII 字符,ASCII编码内容是‘AAAA’”。

base64与文件数据编码

在网络中,通过HTTP传输的文件还可以通过base64对数据进行编码进行传输。就如上面的这个base64的gif格式图片。当然,可以base64编码的文件不仅仅是图片,也可以是字体文件,例如(中间有缺省):

@font-face{
font-family: forTest;
src: url(data:font/woff;charset=utf-8;base64,d09GRgABAAAAAAh4 ... RFERuENEGADl7JlY=) format('woff');
}

自然,对于background-image图片,我们也可以使用base64编码进行传输,例如:

background-image:url(data:image/gif;base64,R0lGODlhBAABAIABAMLBwfLx8SH5BAEAAAEALAAAAAAEAAEAAAICRF4AOw==);

background url base64的更多相关文章

  1. background: url 背景图片加时间戳不显示图片

    在项目中一段这样的代码 背景图片加时间戳图片显示不出来 <div id="header" class="header clearfix" style=&q ...

  2. CSS中background:url(图片) 不能显示的问题

    刚刚碰到一个奇怪的问题,这样一段CSS代码:   .pho6 { background: url(img/pho6.jpg);  } 这段代码居然不能显示出背景图片,路经绝对是没错的代码肯定没有问题, ...

  3. background:url() 背景图不显示

    奇怪的问题: .box-3 { width: 100%; height: 500px; border: solid 2px red; margin-top: 70px; padding: 0 0 0 ...

  4. css background url 路径

    刚刚碰到一个奇怪的问题,这样一段CSS代码: 1 .pho6 { background: url(img/pho6.jpg);  } 这段代码居然不能显示出背景图片,路经绝对是没错的代码肯定没有问题, ...

  5. Django中CSS加载background url('')问题

    Django中CSS加载background url('')问题   在django中, 默认CSS中如果有 background url('images/a.jpg') 这类的属性,会被django ...

  6. MVC action 执行两次 background url()

    大年初七第一天上班就来解决问题,我也是醉了. 其实是历史遗留问题,今天看到后不能忍了,赶紧解决一下. 旧系统中以一个微信版本的列表页面没有问题,在新系统中重新开发一边后发现列表页面的action总是请 ...

  7. background:url(./images.png) no-repeat 0 center的用法

    background:url(./images.png) no-repeat 0 center; //图像地址 不重复 水平位置0 垂直位置居中 background:url(./images.png ...

  8. 对background: url("~assets/img/common/collect.svg") 0 0/14px 14px 的理解

    需求:给收藏数字前面通过::before伪元素添加图标 相关代码: .goods-info .collect { position: relative; } .goods-info .collect: ...

  9. 纯C:url base64

    纯代码,来自互联网 base64.h #ifndef __BASE64_H__ #define __BASE64_H__ #ifdef __cplusplus extern "C" ...

随机推荐

  1. 16.求Sn=a+aa+aaa+aaaa.......之值

    其中a是一个数字,n表示a的位数,例如:2+22+222+2222+22222(此时n=5): #include <stdio.h> #include <stdlib.h> i ...

  2. leetcode题解 1.TwoSum

    1. Two Sum Given an array of integers, return indices of the two numbers such that they add up to a ...

  3. c#抓屏功能在DPI缩放后,截到的图片不完整的问题

    /// <summary> /// 获取屏幕快照 /// </summary> /// <returns></returns> public stati ...

  4. CentOS版Linux系统上运行ASP.NET应用

    一.安装: 1. 安装Apache Http Server yum install httpd2. 安装Mono yum install mono3. 安装Mono插件,用来处理ASP.NET请求 y ...

  5. Python全栈之路----常用模块----datetime模块详解

    相比于time模块,datetime模块的接口则更直观,更容易调用. datetime模块定义了下面这几个类: datetime.date:表示日期的类,常用的属性有year,month,day: d ...

  6. Linux下使用Nginx代理访问json文件报404错误

    在网上看了很多,都说是IIS的问题,关键是使用servlet就可以正常访问,使用Nginx就不行,最后发现是其他问题,解决方案如下: 1.确认配置的路径是否正确,Nginx代理的路径和你访问的路径. ...

  7. python set 集合复习--点滴

    一.set特性: set是一个无序不重复的元素集合. 集合对象是一组无序排列的可哈希的值,集合成员可以做字典中的键.集合支持用in和not in操作符检查成员,由len()内建函数得到集合的基数(大小 ...

  8. LeetCode - Fruit Into Baskets

    In a row of trees, the i-th tree produces fruit with type tree[i]. You start at any tree of your cho ...

  9. win10的linux子系统安装及使用

    最近需要用到linux但是又不想装双系统,正好win10推出了linux子系统,省事了,自己也是煞费苦心才整明白 1.首先你要是很新的win10版本(1607及已上),这样才有下面的步骤 依次在 设置 ...

  10. Java_集合_ArrayLish Comparator比较排序 小笔记

    import java.util.ArrayList; import java.util.Collections; import java.util.Comparator; class Teacher ...