1.html部分

<div class="hover right">
<i class="log_change state_psd"></i>
</div>

2.css部分

.log_change{
display: inline-block;
width: 50px;
height: 40px;
margin-top: 10px;
}
.state_psd{
background:url(../images/密码修改.png) no-repeat center;
}

注意:  i标签需显示为块级元素,加上宽高属性占位

display: inline-block;
width: 50px;
height: 40px;

类似img标签,宽高属性按照规范是需要赋值,先占位

关于i 标签盛放背景图像的更多相关文章

  1. 何时使用img标签,何时使用background-image背景图像

    在什么情况下更适合使用HTML IMG标签来显示一个图像,而不是一个CSS有背景图像,反之亦然? 如下场景使用img标签比较合适: 1.如果图像是等内容的一部分或图表或人(真正的人,而不是股票图人), ...

  2. 2013-10-25笔记,css: mini-width, 标准居中,样式中*号使用,背景图像位置定位

    mini-width:设置元素的最小宽度.該屬性值會對元素的寬度設置一個最小限制.因此,元素可以比制定值寬,但不能比制定值窄.不允許指定負值. 完美的居中佈局: body{text-align: ce ...

  3. CSS背景图像的简单响应

    本文设有很多,最理想的解决方案,响应图像只是其中之一.我们建议您查看不同的方法,然后再选择一个特定的响应图像解决方案,包括这两个:如何避免重复下载响应图像中选择响应图像解决方案. 大家都在谈论的的sr ...

  4. CSS背景图像位置属性background-position百分比详解

    百分比值同关键字很接近,但其操作方式不一样.用百分比值来居中一幅背景图像,也很简单: body { background-image;url(beijing.gif); background-repe ...

  5. DEV winform treelist设置背景图像

    treelist是一个复杂的控件,包括选中行,奇偶行等均可以单独设置显示效果,空白区域上背景图像的代码如下: private void treeList1_CustomDrawEmptyArea(ob ...

  6. 全屏背景:15个jQuery插件实现全屏背景图像或媒体

    动态网站通常利用背景图像或预加载屏幕,以保证所有资源都加载到页面上,在浏览器中充分呈现.现在很多网站都炫耀自己的图像作为背景图像全屏背景,追溯到旧的Flash网站却用自己的方式在HTML资源重布局. ...

  7. a标签的背景图在ie8下显示问题

    今天遇到个小问题,纠结了很久,分享下 a标签添加背景图,需要给a添加display:block样式 但是在ie8下还是不能显示背景图,开始以为是由于a标签为空造成的,试了下添加内容也没用,后来注意到一 ...

  8. a标签的背景图在ie8下不显示的问题

    突然发现临下班时候问题就多, 马上下班了被头头告知线上已经上线很久的活动现在有个兼容性问题, a标签的背景图在ie8下会有不显示的情况. 我自己找了台ie8的机器实验了一下, 发现一切正常, 但是在另 ...

  9. Flutter之Decoration(边框、圆角、阴影、形状、渐变、背景图像等)

    1 继续关系: BoxDecoration:实现边框.圆角.阴影.形状.渐变.背景图像 ShapeDecoration:实现四个边分别指定颜色和宽度.底部线.矩形边色.圆形边色.体育场(竖向椭圆).  ...

随机推荐

  1. javascript jquery console调试方法说明

    控制台(Console)是Firebug的第一个面板,也是最重要的面板,主要作用是显示网页加载过程中产生各类信息. 一.显示信息的命令 Firebug内置一个console对象,提供5种方法,用来显示 ...

  2. 分布式id生成方法

    系统唯一ID是我们在设计一个系统的时候常常会遇见的问题,也常常为这个问题而纠结.生成ID的方法有很多,适应不同的场景.需求以及性能要求.所以有些比较复杂的系统会有多个ID生成的策略.下面就介绍一些常见 ...

  3. web前端基础

    超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议.所有的WWW文件都必须遵守这个标准.设计HTTP最初的目的是为了提供一种发布和接 ...

  4. tornado 06 数据库—ORM—SQLAlchemy——基本内容及操作

    tornado 06 数据库—ORM—SQLAlchemy——基本内容及操作 一. ORM #在服务器后台,数据是要储存在数据库的,但是如果项目在开发和部署的时候,是使用的不同的数据库,该怎么办?是不 ...

  5. Luogu P1131 [ZJOI2007]时态同步 树形DP

    要自下向上调整,尽可能用一个道具修改多个: 搜的时候记录叶节点的最大深度,减一下就好了. #include<cstdio> #include<iostream> #includ ...

  6. C#异步编程之基于任务的异步模式

    http://www.cnblogs.com/afei-24/p/6757361.html该文讲了基于任务的编程,这里再详细介绍一下.一.延续任务 private async static void ...

  7. HDU - 5119 DP

    题意:求异或大于等于m的方案数 j枚举大了会WA..emmm #include<iostream> #include<algorithm> #include<cstdio ...

  8. springboot(八)-定时任务

    在我们的项目开发过程中,经常需要定时任务来帮助我们来做一些内容. 如果我们不用springboot开发的话,我们写定时任务需要写那些配置呢? 我们需要在application.xml文件中添加以下配置 ...

  9. 公钥,私钥,数字签名,SSL的基本概念

    一,公钥私钥 1,公钥和私钥成对出现 2,公开的密钥叫公钥,只有自己知道的叫私钥 3,用公钥加密的数据只有对应的私钥可以 解密 4,用私钥加密的数据只有对应的公钥可以解密 5,如果可以用公钥解密,则必 ...

  10. Kafka消费不到数据的特殊情况

    我大约是把kafka消费不到数据的特殊情况都经历了一遍了吧= =. kafka消费不到数据的原因,首先检查配置之类的,如是否设置了group.id,对应的topic是否正确等等,这些不多说. 下面是我 ...