div背景图片或颜色不显示的解决办法
背景图片不显示的原因:
1. css没有被调用
2. css图片地址不对
3. div的高度没有固定,是auto、没有设值或者高度不够
4. div被嵌套
5. div代码不规范
解决办法:
(1)DIV高度为自动,背景颜色无法显示,在代码中将原代码height:auto; 改为height:100%; overflow:hidden;!important;同时还可以兼容 IE6、7、8和谷歌火狐。
(2)假设对一个对象设置了background背景颜色样式,该对象内部盒子有使用float浮动属性样式,这个时候该对象浮动产生,导致该对象不能撑开,所以css背景颜色就不能无法显示,解决方法有三种,一个是设置clear清除浮动、设置css高度、设置css overflow样式。
(3)高度限制造成了背景颜色不能显示完整,假如你有个对象没有计算好高度(或无意设置了一个很小高度属性样式),因为不确定内容有多少,当内容超过你设置高度限制,这个时候超出部分背景就可能无法显示。设置够高的高度,或取消删除高度样式即可。
案例:
<div style="width:960px;background-color:#000000">
<div style="width:300px; height:200px; float:left">左侧</div>
<div style="width:300px; height:200px; float:left">中部</div>
<div style="width:360px; height:200px; float:left">右侧</div>
</div>
因为外层的div没有设置高度,所以设置如上代码之后,看到的是三个透明的方框,
正确代码如下:
<div style="width:960px; height:200px;background-color:#000000">
<div style="width:300px; height:200px; float:left">左侧</div>
<div style="width:300px; height:200px; float:left">中部</div>
<div style="width:360px; height:200px; float:left">右侧</div>
</div>
div背景图片或颜色不显示的解决办法的更多相关文章
- navigationItem.rightBarButtonItem 设置背景图片,颜色更改解决的方法
self.navigationItem.rightBarButtonItem=[[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@& ...
- ecshop验证码图片无法显示终极解决办法
ecshop验证码图片无法显示终极解决办法 ECSHOP教程/ ecshop教程网(www.ecshop119.com) 2014-06-06 客户在安装好ecshop之后所有前台的证码不显示,后 ...
- android通过BitmapFactory.decodeFile获取图片bitmap报内存溢出的解决办法
android通过BitmapFactory.decodeFile获取图片bitmap报内存溢出的解决办法 原方法: public static Bitmap getSmallBitmap(Strin ...
- iphone H5 input type="search" 不显示搜索 解决办法
H5 input type="search" 不显示搜索 解决办法 H5 input type="search" 不显示搜索 解决方法 在IOS(ipad iP ...
- python matplotlib plot 数据中的中文无法正常显示的解决办法
转发自:http://blog.csdn.net/laoyaotask/article/details/22117745?utm_source=tuicool python matplotlib pl ...
- LoadRunner打开WebTours只显示头部解决办法
LoadRunner打开WebTours只显示头部解决办法 1.遇到这种情况,先查看一下路径HP\LoadRunner\WebTours下的cgierr日志中是否有错误,比如Can't open ...
- eclipse_neon 的Spket 目录下只有一个Task Tags,没有其他的选项,导致没有办法添加提示文件! 添加sdk文件之后还是没有办法显示的解决办法
问题解决办法: 将 spket-1.6.23的安装包里面的features plugins 单独复制到D:\eclipse_neon\dropins 目录下,重启一下eclipse即可正常显示! 添 ...
- dede5.7评论框不显示,文章页表情不显示,解决办法
dede5.7评论框不显示,文章页表情不显示,解决办法 进入dede后台,系统-系统基本参数-其它选项,找到模板引擎禁用标签,去掉里面的php,如图 进入dede模板目录,默认是/templets/d ...
- webpack打包绝对路径引用资源和element ui字体图标不显示的解决办法
webpack打包绝对路径引用资源解决办法: 打开webpack.prod.conf.js 找到output:增加 publicPath: './', 即可,如图 element ui字体图标不显 ...
随机推荐
- 【2017年新篇章】 .NET 面试题汇总(一)
开篇 本次给大家介绍的是我收集以及自己个人保存一些.NET面试题 简介 此次包含的不止是.NET知识,也包含少许前端知识以及.net面试时所涉及的种种考点,希望能给找工作的同学们哪怕一点点帮助. 古人 ...
- 分布式配置管理--百度disconf搭建过程和详细使用
先说官方文档:http://disconf.readthedocs.io/zh_CN/latest/index.html 不管是否要根据官方文档来搭建disconf,都应该看一下这一份文档.精炼清晰地 ...
- ldd获得可执行程序的所有库并输出到指定目录
#!/bin/bash ########################################################################## #ldd可以查看程序的库依 ...
- memcached学习总结
一.介绍1.基于libevent的事件处理 libevent是一套跨平台的事件处理接口的封装,能够兼容包括这些操作系统:Windows/Linux/BSD/Solaris 等操作系统的的事件处理.包装 ...
- Oracle11G卸载教程
用Oracle自带的卸载程序不能从根本上卸载Oracle,从而为下次的安装留下隐患,那么怎么才能完全卸载Oracle呢?那就是直接注册表清除,步骤如下: 1. 开始->设置->控制面板-& ...
- jwplayer 禁止视频的快进,但是可以后退(已实现)
一直在研究.net 的视频播放,最近做起了jwplayer,然后项目要求是视频不能快进,但是可以重复观看已经看过的视频资源. 很简单 在标签<script> 中定义两个变量 var max ...
- JavaScript基础——兼容性、错误处理
JavaScript基础-错误处理Throw.Try.Catch try语句执行可能出错的代码 catch语句处理捕捉到的错误 throw语句创建自定义错误语句 发生的常见的错误类型 可能是语法错误, ...
- JAVA学习之动态代理
JDK1.6中的动态代理 在Java中Java.lang.reflect包下提供了一个Proxy类和一个InvocationHandler接口,通过使用这个类和接口可以生成一个动态代理对象.JDK提供 ...
- android studio 中的 gradle version
刚开始接触AS,从geithub上download了好多项目,每一个都需要改动,对我这种新手来说,慢慢琢磨吧 问题一: 解决办法: 在build.gradle中,将gradle的版本改正如上图所示即可 ...
- 微信开发模式 api 接口文档简介
微信公众平台分为订阅号和服务号,服务号提供9大接口,需要通过微信认证后才能使用这些接口.认证费用300元.下面是接口的大致介绍: 1. 语音识别:通过语音识别接口,用户发送的语音,将会同时给出语音识别 ...