如果不在span中输入任何文本,span设置的背景图将无法显示出来。解决办法就是设置为块元素,然后设置固定的宽高。

参考:http://blog.csdn.net/jarniyy/article/details/49812787

再进一步研究,涉及到两个概念:行内元素和块元素。

个人理解:

行内元素对其设置宽度和高度没有意义,他是根据内容的大小来显示的。所以你对其设置背景而不对其输入文字,将无法显示。代表:span。参考:http://www.w3school.com.cn/tags/tag_span.asp

块元素本身就是显示为一行,可以对其进行修饰会立刻表现出来,是一个独立的表现,包括对其设置任何样式都能改变其效果。典型的是div。参考:http://www.w3school.com.cn/tags/tag_div.asp

html中span不显示背景的更多相关文章

  1. CSS盒子模型中()是透明的,这部分可以显示背景()

    CSS盒子模型中()是透明的,这部分可以显示背景() border margin padding content 我的理解: ·       Margin(外边距) - 清除边框外的区域,外边距是透明 ...

  2. OpenGL中glVertex、显示列表(glCallList)、顶点数组(Vertex array)、VBO及VAO区别

    OpenGL中glVertex.显示列表(glCallList).顶点数组(Vertex array).VBO及VAO区别 1.glVertex 最原始的设置顶点方法,在glBegin和glEnd之间 ...

  3. Js_动画显示背景图片

    jAni是一个可以动画显示背景图片的jQuery插件.这个插件基本上是GIF动画的一个替代品,但是他有他的好处.所有浏览器都支持GIF形式的动画格式,而且也不需要额外的javaScript代码和标记. ...

  4. JS控制文本框中的密码显示/隐藏功能

    <html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...

  5. span 右浮动折行 解决ie6/7中span右浮动折行问题

    A floated box is shifted to the left or right until its outer edge touches the containing block edge ...

  6. Bootstrap中data-src无法显示图片,但是src可以

    在学习bootstrap时,书中的源码是用的data-src来定义图像位置,但是我在使用的时候无法显示图片:data-src可以在img标签中使用来显示图片吗?我使用src可以,而是用data-src ...

  7. span 右浮动折行 解决ie6/7中span右浮动折行问题

    RM8005: IE6 IE7 IE8(Q) 中行内元素后相邻的浮动元素在某些情况下会折行放置在之前行内元素所在行框的底部 标准参考 W3C CSS 2.1 规范文档里对于浮动元素与非浮动行内元素相邻 ...

  8. 使用UIWebView中html标签显示富文本

    使用UIWebView中html标签显示富文本 用UIWebView来渲染文本并期望达到富文本的效果开销很大哦! Work 本人此处直接加载自定义字体"新蒂小丸子体",源码不公开, ...

  9. 控制input输入框中提示信息的显示和隐藏的方法

    在运用html+css+javascrpt进行页面制作时,我们往往会遇到一些影响用户体验,而又容易被我们忽视的小细节.比如,input输入框中的提示信息,怎样才能根据对象获得和失去焦点而实现其显示和隐 ...

随机推荐

  1. Java 集合系列05之 LinkedList详细介绍(源码解析)和使用示例

    概要  前面,我们已经学习了ArrayList,并了解了fail-fast机制.这一章我们接着学习List的实现类——LinkedList.和学习ArrayList一样,接下来呢,我们先对Linked ...

  2. indows 8上强制Visual Studio以管理员身份运行

    http://diaosbook.com/Post/2013/2/28/force-visual-studio-always-run-as-admin-on-windows-8 Windows 8的一 ...

  3. C#.NET 大型通用信息化系统集成快速开发平台 4.0 版本 - 多系统开发接口 - 苹果客户端开发接口

    最近工作上需要,给苹果客户端开发接口,实现集中统一的用户管理,下面是接口调用参考. 1: 获取OpenId? http://127.0.0.1/GetOpenId.ashx?username=Admi ...

  4. Spring Security笔记:使用BCrypt算法加密存储登录密码

    在前一节使用数据库进行用户认证(form login using database)里,我们学习了如何把“登录帐号.密码”存储在db中,但是密码都是明文存储的,显然不太讲究.这一节将学习如何使用spr ...

  5. 给Asp.Net MVC及WebApi添加路由优先级

    一.为什么需要路由优先级 大家都知道我们在Asp.Net MVC项目或WebApi项目中注册路由是没有优先级的,当项目比较大.或有多个区域.或多个Web项目.或采用插件式框架开发时,我们的路由注册很可 ...

  6. 【NDK开发】android-ndk r10环境搭建

    1)打开Android开发者的官网http://developer.android.com/找到Develop点击.如果页面打不开,通过代理来访问. 2)进入后再点击Tools 3)进入后在左侧找到N ...

  7. eclipse技巧总结

       如果遇到错误或警告,先试试统一的方法:在problems view中,右键error或者warnning,选择quick fix serial ID并不常用,如果不实现它,eclipse会给出一 ...

  8. HEU KMS Activator v11.1.0 Windows激活

    HEU KMS Activator基于MDL论坛的“KMS Server Emulator”,是一款KMS激活工具,为“知彼而知己”原创工具.主要适用于Windows以及Office的VL版本,无需联 ...

  9. 十天冲刺---Day2

    站立式会议 站立式会议内容总结: git上Issues新增内容: 燃尽图 照片

  10. Shell命令_正则表达式

    正则表达式是包含匹配,通配符是完全匹配 基础正则表达式 test.txt示例文件 1 2 3 4 5 6 7 8 9 10 11 12 Mr. James said: he was the hones ...