http://www.sufeinet.com/plugin.php?id=keke_group

苏飞论坛

 找回密码
 马上注册

QQ登录

只需一步,快速开始

分布式系统框架(V2.0) 轻松承载百亿数据,千万流量!讨论专区 - 源码下载 - 官方教程

HttpHelper爬虫框架(V2.7-含.netcore) HttpHelper官方出品,爬虫框架讨论区 - 源码下载 - 在线测试和代码生成

HttpHelper爬虫类(V2.0) 开源的爬虫类,支持多种模式和属性 源码 - 代码生成器 - 讨论区 - 教程- 例子

查看: 5859|回复: 2

[CSS] CSS中background-image的巧妙使用

[复制链接]
发表于 2013-5-4 23:36:50 | 显示全部楼层 |阅读模式
今天在网上突然看到CSS中background-image的另类使用,于是雪洁就贴出来让和俺一样没看过的人也看看,嘿嘿。      其实css显示图片分3种,第一种是单纯的显示一个图片;第二种称之为CSS Sprites,也就是说把若干小图片合成一个大图片,然后通过background的postion参数实现效果,第三种就是我们今天说的另类用法,它也有学名称之为Inline images。实现声明一点,这个方法不适用于IE浏览器,恩,没错,IE,我们都遗弃你了。

       CSS Sprites是一种把所有的图片都以base64编码以源代码的形式写在CSS文件里,格式是这样的:data:[<mediatype>][;base64],<data>

      data:URL标签是在1995年第一次提出,按RFC2397 规范的描述:它是"allows inclusion of small data items as 'immediate' data.(允许在页面中包含一些小的即时数据)"。如一个内嵌的的图片可以这样引用:
       body{background-image:url (data:image/gif;base64,R0lGODlhCAAIAJEAAOnp6eTk5O7m8AAAACH5BAEAAAIALAAAAAAIAAgAAAINjAMJh2q6DnxOVsqmLQA7);}这段代码可以在firefox浏览器运行,恩,图片是我取自mg12当前模板的背景图,呵呵(^___^)
       base64编码简单的说是,Base64内容传送编码被设计用来把任意序列的8位字节描述为一种不易被人直接识别的形式。最早使用在 windows系统的电子邮件传输的,主要是附件的传输。在那个时候的黑客们也流行过一段base64编码版的木马和病毒。为了简单篇幅,想了解的看这里。
       第一次我也是通过这个方法获取的图片的base64编码,主要原因是网上没有现成的转换这种编码的工具,估计已经被大家所遗忘掉了。图片的代码转换原理也很简单,通过读取图片的文件并把图片储存在一个数组(或字符串)里面,然后使用base64_encode转换即可~ok,讲解完毕。


1. 开通SVIP会员,免费下载本站所有源码,不限次数据,不限时间
2. 加官方QQ群,加官方微信群获取更多资源和帮助
3. 找站长苏飞做网站、商城、CRM、小程序、App、爬虫相关、项目外包等点这里
发表于 2013-6-30 21:09:31 | 显示全部楼层
终于看完了~~~
发表于 2013-7-30 23:18:19 | 显示全部楼层
谢了.学习中,先顶
您需要登录后才可以回帖 登录 | 马上注册

本版积分规则

QQ|手机版|小黑屋|手机版|联系我们|关于我们|广告合作|苏飞论坛 ( 豫ICP备18043678号-2)

GMT+8, 2024-11-8 17:37

© 2014-2021

快速回复 返回顶部 返回列表